<template>
	<view class="out-box">
		<!-- 上方bannar图 -->
		<view class="hader" v-if="hader_show == 1">
			<!-- 左侧的搜索框 -->
			<view class="positioning">
				<image class="positioning_left" src="../../static/images/定位.png"></image>
				<!-- <view class="positioning_right">{{ foundation_value.region == '' ? '全国': foundation_value.region }}</view> -->
				<picker mode="multiSelector" 
					:value="multiIndex" 
					:range="newAddressList" range-key="label"
					@change="pickerChange"
					@cancel="pickerCancel"
					@nodeclick="popupopened"
					@columnchange="pickerColumnchange">
						<span class="positioning_right">{{ page_information.region != '不限'&&page_information.region != '' ? page_information.region : page_information.city }}</span>
				</picker>
			</view>
			<!-- 右侧联级展示 -->
			<view class="search_mian">
				<view class="search">
					<uni-easyinput
              
						:clearable='false'
						prefixIcon ="search" 
						@focus="focus"
						:inputBorder="false"
						v-model="page_information.serach_value" 
						:placeholderStyle="placeholderStyle" 
						placeholder="搜索店铺信息" 
						>
					</uni-easyinput>
				</view>
				<view class="opensearch" @tap="iconClick">搜索</view>
			</view>
		</view>
		<!-- 滑动选择的框 -->
		<view class="whatShop" v-show="hader_show == 1">
			<!-- 中间的单选框 -->
			<view class="whatShop_mina">     
				<zb-tab shrink 
				:activeStyle="{
					fontWeight: 'bold',
					transform: 'scale(1.1)'
					}"
					lineColor="#fff"
					:data="title_type" 
					v-model="active_title_type.value"
					@click-tab="tabClick">
				</zb-tab>
			</view>
		</view>
		<!-- 中间分类 -->
		<view class="nav" ref="scrollRef">
			<view class="nav_main">
				<view :class="display_store==0 ?'nav_main_item active' : 'nav_main_item'"  @tap="show_shop(0)">
					<view class="nav_main_item_span">店铺转让</view>
				</view>
				<view :class="display_store==1 ?'nav_main_item active' : 'nav_main_item'"  @tap="show_shop(1)">
					<view class="nav_main_item_span">店铺出租</view>
				</view>
				<view :class="display_store==2 ?'nav_main_item active' : 'nav_main_item'" @tap="show_shop(2)">
					<!-- <uni-icons type="search" size="40" color="green"></uni-icons>
					<br> -->
					<view class="nav_main_item_span">求租信息</view>
					<!-- <view class="nav_item_bottom">优质求租信息</view> -->
				</view>
			</view>
			<!-- 选择各种小类型 -->
			<view class="dropBown" v-if="display_store == 0 || display_store == 1">
				<view :class="porpshow==1?'dropBownone active':'dropBownone'" @tap="click_type(1)">
					<view class="dropBownone_left">{{search_son_selse.selse_shop}}</view>
					<view class="dropBownone_right"></view>
				</view>
				<view :class="porpshow==2?'dropBownone active':'dropBownone'" @tap="click_type(2)">
					<view class="dropBownone_left">{{ search_son_selse.selse_area }}</view>
					<view class="dropBownone_right"></view>
				</view>
				<view :class="porpshow==3?'dropBownone active':'dropBownone'" @tap="click_type(3)">
					<view class="dropBownone_left">{{ search_son_selse.selse_rent }}</view>
					<view class="dropBownone_right"></view>
				</view>
			</view>
		</view>
		<!-- 最下方的数据展示 -->
		<view class="main">
			 <!-- 内容区域 -->
			<view class="main_lists" v-if="display_store == 0">
				<!-- 弹框遮罩层 -->
				<view class="shop_son_type" v-if="porpshow == 1">
					<!-- 店铺类型的子列表 -->
					<view class="son_type_one">
						<view v-for="(item,index) in active_title_type.active.childList" :key="item.id">
							<view :class="item.id==select.active_type.id?'type_one_item active_son':'type_one_item'"
							@tap="onclicktype(item)"
							>{{ item.name }}</view>
						</view>
					</view>
					<!-- 按钮 -->
					<view class="son_type_two">
						<view class="type_two_let" @tap="close_type">取消</view>
						<view class="type_two_right" @tap="post_list">确定</view>
					</view>
					<view class="son_type_three" @tap="close_type"></view>
				</view>
				<view class="shop_son_type" v-if="porpshow == 2">
					<!-- 租金的列表 -->
					<view class="son_type_one">
						<view v-for="(item,index) in zhujin" :key="item.id">
							<view :class="item.id==select.active_money.id?'type_one_item active_son':'type_one_item'"
							@tap="onclickmoney(item)" 
							>{{item.name}}</view>
						</view>
					</view>
					<!-- 按钮 -->
					<view class="son_type_two">
						<view class="type_two_let" @tap="close_type">取消</view>
						<view class="type_two_right" @tap="post_list">确定</view>
					</view>
					<view class="son_type_three" @tap="close_type"></view>
				</view>
				<view class="shop_son_type" v-if="porpshow == 3">
					<!-- 面积的列表 -->
					<view class="son_type_one">
						<view v-for="(item,index) in mianji" :key="item.id">
							<view :class="item.id==select.active_area.id?'type_one_item active_son':'type_one_item'"
							@tap="onclickarea(item)" 
							>{{ item.name }}</view>
						</view>
					</view>
					<!-- 按钮 -->
					<view class="son_type_two">
						<view class="type_two_let" @tap="close_type">取消</view>
						<view class="type_two_right" @tap="post_list">确定</view>
					</view>
					<view class="son_type_three" @tap="close_type"></view>
				</view>
				<!-- 空白的情况 -->
				<view class="main_listone" style="z-index: 66;" v-if="page_information.shop_assemble == 0"></view>
				<scroll-view class="scroll-one" 
					v-if="page_information.shop_assemble != 0" 
					lower-threshold="10" scroll-y="true"
					@scrolltolower="loadMore" @scroll="scroll">
					<view v-for="item,index in lists" :key="index">
						<view class="main_lists_item" @tap="todetails(item)">
						<!-- 最上方置顶 -->
							<view class="Topping" v-if="item.is_expired == 0">置顶</view>
							<view class="item_left">
								<image class="item_left_img" :src=item.cover_img></image>
								<view class="visits">
									<image class="visits_img" src="../../static/images/yanjin.png"></image>
									<!-- item.exposure_count  -->
									<view class="visits_num">{{ item.exposure_count }}</view>
								</view>
							</view>
							<view class="item_right">
								<view class="item_right_one"><span v-if="item.is_swerve == 1" class="isspan">（急转）</span>{{item.title}}</view>
								<view class="item_right_two_big">
									<view class="item_right_two">{{item.city + '-'+item.county}}</view>
									<view class="three_are">{{  item.shop_area+"m²"}}</view>
								</view>
								<view v-if="item.feature_label" class="item_right_identifying">
									<view  class="item_right_identifying_item" v-for="item1,index1 in item.feature_label.split(',')" :key="index1">
										<view>{{ item1}}</view>
									</view>
								</view>
								<view class="item_right_three">
									<view class="three_money">{{ ( item.rent == '' || item.rent == null ||item.rent == '面议' || item.rent =='null') ? '面议': item.rent + '元' }}<span class="span1" v-if="item.rent !=null">/月</span></view>
									<view class="three_time">{{item.update_time != null ? item.update_time : item.create_time}}</view>
								</view>
							</view>
						</view>
					</view>
					<view class="show_Loading" v-show="page_information.showLoading">{{page_information.showtext}}</view>
					<view class="kbhz"></view>
				</scroll-view>	
			</view>
			<!-- 出租列表 -->
			<view class="main_lists" v-if="display_store == 1">
				<!-- 弹框遮罩层 -->
				<view class="shop_son_type" v-if="porpshow == 1">
					<!-- 店铺类型的子列表 -->
					<view class="son_type_one">	
						<view v-for="(item,index) in active_title_type.active.childList" :key="item.id">
							<view :class="item.id==select.active_type.id?'type_one_item active_son':'type_one_item'"
							@tap="onclicktype(item)" 
							>{{ item.name }}</view>
						</view>
					</view>
					<!-- 按钮 -->
					<view class="son_type_two">
						<view class="type_two_let" @tap="close_type">取消</view>
						<view class="type_two_right" @tap="post_list">确定</view>
					</view>
					<view class="son_type_three" @tap="close_type"></view>
				</view>
				<view class="shop_son_type" v-if="porpshow == 2">
					<!-- 租金的列表 -->
					<view class="son_type_one">
						<view v-for="(item,index) in zhujin" :key="item.id">
							<view :class="item.id==select.active_money.id?'type_one_item active_son':'type_one_item'"
							@tap="onclickmoney(item)" 
							>{{item.name}}</view>
						</view>
					</view>
					<!-- 按钮 -->
					<view class="son_type_two">
						<view class="type_two_let" @tap="close_type">取消</view>
						<view class="type_two_right" @tap="post_list">确定</view>
					</view>
					<view class="son_type_three" @tap="close_type"></view>
				</view>
				<view class="shop_son_type" v-if="porpshow == 3">
					<!-- 面积的列表 -->
					<view class="son_type_one">
						<view v-for="(item,index) in mianji" :key="item.id">
							<view :class="item.id==select.active_area.id?'type_one_item active_son':'type_one_item'"
							@tap="onclickarea(item)" 
							>{{ item.name }}</view>
						</view>
					</view>
					<!-- 按钮 -->
					<view class="son_type_two">
						<view class="type_two_let" @tap="close_type">取消</view>
						<view class="type_two_right" @tap="post_list">确定</view>
					</view>
					<view class="son_type_three" @tap="close_type"></view>
				</view>
				<!-- 列表没有数据的情况 -->
				<view class="main_listone" style="z-index: 66;" v-if="page_information.shop_assembletwo == 0"></view>
				<scroll-view class="scroll-one" 
					v-if="page_information.shop_assembletwo != 0" 
					lower-threshold="10" scroll-y="true" 
					@scrolltolower="loadMoreone" @scroll="scrollcz">
					<view v-for="item,index in listone" :key="index">
						<view class="main_lists_item" @tap="todetails(item)">
						<!-- 最上方置顶 -->
							<view class="Topping" v-if="item.is_expired == 0">置顶</view>
							<view class="item_left">
								<image class="item_left_img" :src=item.cover_img></image>
								<view class="visits">
									<view class="visits_img"></view>
									<!-- item.exposure_count -->
									<view class="visits_num">{{ item.exposure_count }}</view>
								</view>
							</view>
							<view class="item_right">
								<view class="item_right_one"><span v-if="item.is_swerve == 1" class="isspan">（急转）</span>{{item.title}}</view>
								<view class="item_right_two_big">
									<view class="item_right_two">{{item.city + '-'+item.county}}</view>
									<view class="three_are">{{  item.shop_area+"m²"}}</view>
								</view>
								<view v-if="item.feature_label" class="item_right_identifying">
									<view  class="item_right_identifying_item" v-for="item1,index1 in item.feature_label.split(',')" :key="index1">
										<view>{{ item1}}</view>
									</view>
								</view>
								<view class="item_right_three">
									<view class="three_money">{{ ( item.rent == '' || item.rent == null ||item.rent == '面议' || item.rent =='null') ? '面议': item.rent + '元' }}<span class="span1" v-if="item.rent !=null">/月</span></view>
									<view class="three_time">{{item.update_time != null ? item.update_time : item.create_time}}</view>
								</view>
							</view>
						</view>
					</view>
					<view class="show_Loading" v-show="page_information.showLoadingone">{{page_information.showtextone}}</view>
				</scroll-view>
			</view>
				<!-- 求助列表 -->
			<view class="main_listtwo" v-if="display_store == 2">
				<view class="main_twoif" v-if="page_information.rent_assemble == 0">
					<image class="img" src="../../static/images/kongbai3.png"></image>
				</view>
				<scroll-view v-if="page_information.rent_assemble != 0" 
				class="scroll-two" lower-threshold="10" scroll-y="true" 
				@scrolltolower="loadMoretwo"  @scroll="scrolltwo">
				<view v-for="item,index in listtwo" :key="index">
					<view class="lists_item" @tap="search(item)">
						<!-- 最上方置顶 -->
						<view class="Toppingtwo" v-if="item.is_expired == 0">置顶</view>
						<view class="item_left">
							<view class="item_left_one"><span v-if="item.is_swerve == 1" class="isspan">(急租)</span>{{ item.title }}</view>
							<view  class="item_right_identifying" v-if="item.feature_label != null && item.feature_label != ''">
								<view class="item_right_identifying_item" v-for="item1,index in item.feature_label.split(',')" :key="index">
									<view >{{ item1}}</view>
								</view>
							</view>
							<view class="item_left_two">联系人：{{ item.name }}</view>
							<view class="item_right_three">
								<view class="three_ipone">联系电话：{{item.phone}}</view>
								<view class="three_time">更新于:{{ item.update_time != null ? item.update_time : item.create_time  }}</view>
							</view>
							<view class="hrone"></view>
						</view>
					</view>
				</view>
				<view class="show_Loading" v-show="page_information.showLoadingtwo">{{page_information.showtexttwo}}</view>
				</scroll-view>
			</view>
		</view>
	</view>
	<!-- <view class="tabbar">
		<Tabbar />
	</view> -->
	<!-- 首页操作弹框 -->
	<uni-popup ref="popup" :is-mask-click="false">
		<!-- <view class="popupipone">
			<image class="image" src="../../static/images/book.png"></image>
			<view class="popupipone_imgtwo" @tap="colse_popup()"></view>
			<view class="tk_one">
				<view class="title_one">查看更多转店出租信息</view>
				<view class="title_two">通过本平台发布转店、出租、找店信息，省时省力省时间，填写信息快速为您精准定向推荐匹配</view>
			</view>
			<view class="hr"></view>
			<view class="title_name">您想要转店还是找店？</view>
			<view class="radio">
				<view :class="tan_value == 1? 'radio_item active':'radio_item'" @tap="tannn(1)">
					<view class="item_left">
						<view class="text_top">我要转店</view>
						<view class='text_bottom'>转让、出租信息匹配</view>
					</view>
					<view class="item_right" style="background: url(../../static/images/zd.png)no-repeat;background-size: 100% 100%;"></view>
				</view>
				<view :class="tan_value == 2? 'radio_item active':'radio_item'" @tap="tannn(2)">
					<view class="item_left">
						<view class="text_top">我要找店</view>
						<view class='text_bottom'>精准匹配合适的店铺</view>
					</view>
					<view class="item_right" style="background: url(../../static/images/cz.png)no-repeat;background-size: 100% 100%;"></view>
				</view>
			</view>
			<view class="title_name">填写联系人</view>
			<input class="input_one" placeholder-style="font-size:30rpx;" placeholder="请填写联系人名称" v-model="user.name"/>
			<view class="title_name">您的联系电话</view>
			<view class="getphone">
				<input class="input_twoo" placeholder-style="font-size:30rpx;" placeholder="请填写联系电话" v-model="user.phone"/>
				<button class="logon" open-type="getPhoneNumber" v-show="user.phone==''" @getphonenumber="getPhoneNumber">获取手机号</button>
			</view>
			<view class="title_name">您店铺所在的区域是？</view>
			<view class="region">
				<view class="address_i"></view>
				<view class="Address-item">
					<picker mode="multiSelector" :value="multiIndex"
						:range="newAddressList" range-key="label"
						@change="pickerChange" @cancel="pickerCancel"
						@columnchange="pickerColumnchange">
						<view class="uni-input">{{addressList.join('-')}}</view>
					</picker>
				</view>
				<view class="address_ii"></view>
			</view>
			<view class="tijiao" @tap="toform">下一步</view>
		</view> -->
		<view class="popupbase">
			<image class="icon" src="../../static/images/dunpai.png"></image>
			<view class="cha" @tap="colse_popup"></view>
			<view class="tit1">
				<view class="titone">此功能为会员功能</view>
				<view class="tittwo">会员可享更多权益</view>
			</view>
			<view class="quanyi">
					<view class="item">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/z1.png"></image>
						</view>
						<view class="bigtit">转店查看</view>
						<!-- <view class="tit">每天30次</view> -->
					</view>
					<view class="item">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/q2.png"></image>
						</view>
						<view class="bigtit">出租查看</view>
						<!-- <view class="tit">每天30次</view> -->
					</view>
					<view class="item">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/q3.png"></image>
						</view>
						<view class="bigtit">电话查看</view>
						<!-- <view class="tit">每天30次</view> -->
					</view>
					<view class="item">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/q52.png"></image>
						</view>
						<view class="bigtit">专属客服</view>
						<!-- <view class="tit">24小时在线咨询</view> -->
					</view>
			</view>
			<view class="buttom" @tap="toform">确认</view>
		</view>

	</uni-popup>
	<!-- 求租支付弹框 -->
	<uni-popup ref="paypopup" :is-mask-click="false">
		<view class="popuppay">
			<view class="popuppay_imgtwo" @tap="colse_paypopup()"></view>
			<view class="main_one">
				<view class="black"></view>
				<view class="black_tit">会员套餐</view>
			</view>
			<view class="check">
				<view v-for="(item,index) in product_value.required" :key="index">
					<view :class="product_value.default.id == item.id? 'item active' : 'item '" @tap="cpdefault(item)">
						<view class="tit">{{ item.product_name }}</view>
						<view class="money">{{ '￥' + item.now_money/100 }}</view>
						<view class="jiaobiao" v-if="product_value.default.id == item.id" ></view>
					</view>
				</view>
			</view>
			<view class="main_one">
				<view class="black_tit">会员专属权益</view>
			</view>
			<view class="quanyi">
					<view class="item">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/z1.png"></image>
						</view>
						<view class="bigtit">转店查看</view>
						<view class="tit">{{ product_value.dier.id == product_value.default.id?'无限次数':'每天30次' }}</view>
					</view>
					<view class="item">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/q2.png"></image>
						</view>
						<view class="bigtit">出租查看</view>
						<view class="tit">{{ product_value.dier.id == product_value.default.id?'无限次数':'每天30次' }}</view>
					</view>
					<view class="item">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/q3.png"></image>
						</view>
						<view class="bigtit">电话查看</view>
						<view class="tit">{{ product_value.dier.id == product_value.default.id?'无限次数':'每天30次' }}</view>
					</view>
					<view class="item">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/q5.png"></image>
						</view>
						<view class="bigtit">微信添加</view>
						<view class="tit">{{ product_value.dier.id == product_value.default.id?'无限次数':'每天30次' }}</view>
					</view>
					<view class="item" v-if="product_value.dier.id == product_value.default.id">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/q52.png"></image>
						</view>
						<view class="bigtit">专属客服</view>
						<view class="tit">24小时在线咨询</view>
					</view>
					<view class="item" v-if="product_value.dier.id == product_value.default.id">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/q6.png"></image>
						</view>
						<view class="bigtit">精准匹配</view>
						<view class="tit">系统精准推荐</view>
					</view>
					<view class="item" v-if="product_value.dier.id == product_value.default.id">
						<view class="icon_bag">
							<image class="icon" src="../../static/images/q7.png"></image>
						</view>
						<view class="bigtit">发布置顶</view>
						<view class="tit">全平台15天置顶</view>
					</view>
			</view>
			<view class="bottom">
				<view class="bottom_one"> {{'实际支付金额￥' + product_value.allmoney/100 }}</view>
				<view class="bottom_two" @tap="pay_qz">立即购买</view>
			</view>
		</view>
	</uni-popup>
		<!-- 授权手机号弹窗 -->
	<uni-popup ref="get_phone" :is-mask-click="false">
		<view class="empowerphone">
			<view class="hader">
				<image class="img" src="../../static/images/铺铺转.png"></image>
				<!-- <image class="colse" src="../../static/images/chacha.png" @tap="colse_get_phone()"></image> -->
			</view>
			<!-- 一键授权的框 -->
			<button class="logon" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">一键登录</button>
			<!-- 其他手机号的框 -->
			<view class="other" @tap="base_information">其他手机号登录</view>
			<!-- 下面的勾选同意不同意 -->
			<view class="agreement">
				<view :class="user.isshow ==true?'imaage':'imtwo'" @tap="changeisshow"><image class="img" src="../../static/images/gou.png"></image></view> 勾选即表示已阅读并同意
				<span class="span1" @tap="toyhxy(1)">《用户协议》</span>和<span class="span1" @tap="toyhxy(2)">《隐私协议》</span>
			</view>
		</view>
	</uni-popup>
	<!-- 输入手机号弹窗 -->
	<uni-popup ref="input_phone" :is-mask-click="false">
		<view class="input_phone">
			<view class="hader">
				<!-- <image class="img" src="../../static/images/铺铺转.png"></image> -->
				<view class="tit">填写手机号登录</view>
				<!-- <image class="colse" src="../../static/images/chacha.png" @tap="colse_input_phone()"></image> -->
			</view>
			<input class="input_one" placeholder-style="font-size:30rpx;" placeholder="请填写联系电话" v-model="user.phone"/>
			<!-- 其他手机号的框 -->
			<view class="logon" @tap="sure_phone">登录</view>
			<!-- 下面的勾选同意不同意 -->
			<view class="agreement">
				<view :class="user.isshow ==true?'imaage':'imtwo'" @tap="changeisshow"><image class="img" src="../../static/images/gou.png"></image></view> 勾选即表示已阅读并同意
				<span class="span1" @tap="toyhxy(1)">《用户协议》</span>和<span class="span1" @tap="toyhxy(2)">《隐私协议》</span>
			</view>
		</view>
	</uni-popup>
</template>

<script setup>
import {throttle} from '../../components/throttle/throttle'
// import areaData from '../../util/js/area3'
import {onGotApiData,addClick,onGotApi} from '../../util/api.js'
import {ref,reactive,onBeforeMount,onMounted} from 'vue'
import {onShareAppMessage,onShow} from '@dcloudio/uni-app'
// import uni from '@dcloudio/uni-ui';
// import { onPullDownRefresh } from '@dcloudio/uni-app';
//获取上级页面带的参数
const props = defineProps({
	link_id: String,
	ip_id: String,
});
console.log("props",props)
// 在组件渲染之前执行 
onBeforeMount(() => {
	console.log('组件准备渲染'); 
	user.channel_no = uni.getStorageSync('channel_no')||''
	user.order_count = uni.getStorageSync('order_count')||0
	user.user_id = uni.getStorageSync('user_id')||''
	user.openid = uni.getStorageSync('open_id')||''
	user.phone = uni.getStorageSync('phone')||''
	user.phone
	console.log('user_id',user.user_id)

	// 判断有没有登录
	if(!user.phone){
		get_code()
	}
	// 请求地区数据
	getdiqu()
	// console.log("地址全部数据",areaData)
	// 首页基础数据
	foundation()
	// 首页店铺类型的接口
	home_type()
	// input_phone.value.open('bottom')
	// console.log("环境",process.env.NODE_ENV)
	// 微信小程序跳转过来绑定
	if(props.link_id){
		// 弹出提示框
		// open()
		// const linkId = props.link_id
		// 调用绑定函数
		binding()
	}
	// 进页面获取地址
	onpositioning()
	// 在onlod里面配置分享
	uni.showShareMenu({
		withShareTicket: true,
		menus: ['shareAppMessage', 'shareTimeline'], 
		showShareItems: ['wechatFriends', 'wechatMoment', 'qq', 'qzone']
	});
})
// 每次切换展示页面
onShow(()=>{
	// 支付成功之后跳转回来刷新列表(之前只有两个)
	console.log('onShow',uni.getStorageSync('refresh_index') || 0)
	const refresh_index = uni.getStorageSync('refresh_index') || 0
	user.phone = uni.getStorageSync('phone')||''
	if(refresh_index == 1){
		// 最新店铺的页数
		page_information.pageone = 1
		// 调用转让店铺信息的接口
		lists_post()
	}else if(refresh_index == 2){
		// 求租店铺的页数
		page_information.pagetwo = 1
		// 调用求租店铺信息的接口
		listtwo_post()
	}
	// 刷新个人信息
	// if(user.user.openid){
		// get_user_id()
	// }
	user.order_count = uni.getStorageSync('order_count')
	// 请求之后就清空
	uni.setStorageSync('refresh_index',0)
})
// 分享带的参数
onShareAppMessage(()=> {
      return {																																																
        title: '铺铺转',
        path: '/pages/index/index?say=我可以传参数',
        // imageUrl: '/static/images/yanjin.png'
      };
    });
// 在组件渲染完成后执行
onMounted(() => {
	console.log('组件已经渲染完毕');

});

// onShareAppMessage((res)=>{
// 	if (e.from === 'bsutton') {
// 				//console.log('来自页面内转发按钮');
// 		} else if (e.from === 'menu') {
// 			//console.log('右上角菜单转发按钮');
// 		}
// 		return { // 自定义分享内容
// 			title: '铺铺转',
// 			desc: '铺铺转',
// 			path: `/pages/index/index` // 路径，可传递参数到指定页面
// 		}
//   });

// 请求地区的数据 js
const getdiqu = ()=>{
	uni.request({
		url:'https://shop-h5.pupuduo.com/js/area3.js',
		method:'GET',
		success:function(res){
			oldAddressList = res.data;
			console.log("log",res.data)
			// console.log('oldAddressList',oldAddressList)
				// 初始化地区的数组
				initAddress();
			},
		fail:function(err){
			console.log(err);
		}
	}) 
}

// 页面被激活时触发，可以在这里执行一些操作
// activated(() =>{
// 	console.log('页面被激活时触发')
// });
// // 页面被停用时触发，可以在这里执行一些操作
// deactivated(() => {
// console.log('页面被停用时触发')
// });
// 本页的提交资料
let user = reactive({
	name:"",
	phone:"",
	channel_no:'',
	user_id:'',
	openid:'',
	qz_shopid:'',
	order_count:0,
	qz_shopid:'',
	zr_shopid:'',
	isshow:false,
})
// 本页面的关键变量
let page_information = reactive({
	// 转让店铺的页数
	pageone:1,
	// 出组店铺的页数
	pageonecz:1,
	// 求租店铺的页数
	pagetwo:1,
	// 转让店铺上拉加载
	showLoading:false,
	// 出租店铺上拉加载
	showLoadingone:false,
	// 求租店铺上拉加载
	showLoadingtwo:false,
	// 加载文字
	showtext:'加载更多店铺中...',
	// 加载文字
	showtextone:'加载更多店铺中...',
	// 加载文字
	showtexttwo:'加载更多店铺中...',
	// 店铺转让总条数
	shop_assemble:0,
	// 转让当前条数
	objectCount:null,
	// 店铺出租总条数
	shop_assembletwo:0,
	// 出租当前条数
	objectCounttwo:null,
	// 求租总条数
	rent_assemble:0,
	// 求租当前条数
	rent_count:null,
	// 地址
	region:'不限',
	// 获取到的省市区
	province:'',
	city:'不限',
	district:'不限',
	// 获取到的地址
	address:"",
	// 商铺一级分类（传id）
	shop_first_type:1,
	// 商铺类型（中文）
	shop_type:'',
	// 租金
	rent:'',
	shop_area:'',
	// 搜索内容
	serach_value:'',
	// 请求列表的判断数字
	getNum:0,
})

// 搜索框的样式
const placeholderStyle = ref('color:#999;font-size:30rpx;font-family: PingFang SC-Regular, PingFang SC;')
let inputvalue = ref('')
// 点击搜索图标
const iconClick = () =>{
	console.log('我是搜索框')
	// 点击搜索先把页数调成1
	page_information.pageone = 1
	page_information.pageonecz = 1,
	page_information.pagetwo = 1
	if(display_store.value == 0){
		// 调用转让店铺信息的接口
		lists_post()
	}else if(display_store.value == 1){
		// 调用求租店铺信息的接口
		listone_post()
	}else if(display_store.value == 2){
		// 调用求租店铺信息的接口
		listtwo_post()
	}
}
// 输入框获取焦点
const focus = () =>{
	// 关闭弹框
	porpshow.value = 0
}
// 同意隐私协议的按钮
const changeisshow = ()=>{
	console.log("user.isshow ",user.isshow )
	user.isshow = !user.isshow
}
// 跳转到协议
const toyhxy = (num)=>{
	console.log('1',1)
	uni.navigateTo({
		url: '/pages/toyhxy/toyhxy?num=' + num
	});
}
	// 获取用户信息和openid
	const get_code =  () => {
		wx.login({
			success: function(res) {
				console.log('我是code',res.code);//这里的返回值里面便包含code
				// code_value.code = res.code
				get_open_id(res.code)
				// 获取用户的头像和name
				// wx.getUserInfo({
				// 	success: function(res) {
				// 		console.log('我是用户信息',res)
				// 		code_value.encryptedData = res.encryptedData
				// 		code_value.iv = res.iv 
				// 		console.log('执行 get_open_id')
				// 		// 获取open_id接口
				// 	}
				// })
			},
			fail: function(res) {
				console.log('登陆失败');
			},
			complete: function(res) {},
			})	
	}
	// 获取open_id,user_id
	const get_open_id = (code) =>{
			// 获取openid相关的变量方法
		let params = reactive({
			code : code,
			// encryptedData : code_value.encryptedData,
			// iv : code_value.iv
		})
		console.log("params",params)
		onGotApiData('/api/app/login/v1/login','POST',params,open_id_result)
	}

	// 获取openid的结果
	const open_id_result = (result) => {
		console.log('result获取open_id',result)
		user.openid = result.openid
		user.user_id = result.userid
		uni.setStorageSync('open_id', result.openid);
		uni.setStorageSync('user_id', result.userId);
		// 获取openid跳转到我的页面
		get_user_id()
	}

	// 查询个人信息
	const get_user_id = () =>{
		let params = reactive({
			openid : user.openid
		})
		console.log("params",params)
		onGotApiData('/api/app/mine/v1/user_info','GET',params,user_id_result)
	}
	// 查询个人信息的结果
	const user_id_result = (result) => {
		console.log('获取到的user_id',result)
		// uni.setStorageSync('user_id', result.user_id);
		user.user_id = result.user_id
		// 判断返回的有没有手机号
		if(result.phone){
			console.log("手机号",result.phone)
			user.phone = result.phone
			uni.setStorageSync('phone', user.phone);
		}else{
			console.log("手机号弹框1",result.phone)
			get_phone.value.open('bottom')
		}
		// 是否有已经支付的订单
		uni.setStorageSync('order_count',result.order_count)
		user.order_count = result.order_count
	}	
	// 填写自己手机号的弹框
	const base_information = ()=>{
		// 先关闭遮罩层
		colse_get_phone()
		input_phone.value.open('bottom')
	}
	// 填写完自己的手机号然后点击登录
	const sure_phone = () =>{
		const phoneReg = /^1[3456789]\d{9}$/
		if (!phoneReg.test(user.phone)) {
			uni.showToast({
				title:'请输入正确的手机号',
				icon:'none',
				duration: 1500
			}) 
			return
		}
		// 通过之后关闭弹框
		colse_input_phone()
		console.log('手动填写的手机号',user.phone)
		let params = reactive({
				phone:user.phone,
				user_id : user.user_id
			})
		console.log("params",params)
		onGotApiData('/api/app/mine/phone_binding','POST',params,modify_value)	
	}
	// 修改手机号的结果
	const modify_value = (result) => {
			uni.showLoading({
					title: '绑定信息中...',
					mask: true,
					duration: 2000,
			})
		// 调用查询订单信息
		get_code()
	}

// 定义遮罩层的弹框初始值
const popup = ref(null)
const paypopup = ref(null)
const get_phone = ref(null)
const input_phone = ref(null)
// 弹框相关配置
// 转让求租的选择值	
let tan_value = ref(2)
// 打开手机号更改页面
const open = () =>{
	popup.value.open('center')
}
// 关闭遮罩层
const colse_popup = ()=>{
	popup.value.close()
}
const colse_paypopup = ()=>{
	paypopup.value.close()
}
const colse_get_phone = ()=>{
	get_phone.value.close()
}
const colse_input_phone = ()=>{
	input_phone.value.close()
}
// 跳转到我的界面
const gotomy = () =>{
	uni.switchTab({
		url: '/pages/my/my'
	});
}
// 点击切换转让求租
const tannn = (val)=>{
	tan_value.value  = val 
	console.log("改变的值",tan_value.value)
}
// 点击弹框的下一步
const toform = () =>{
	// 校验手机号是否为空
	// if(user.phone == '' || user.name == ''){
	// 	uni.showToast({
	// 		title:'请完整填写表单',
	// 		icon:'none',
	// 		duration: 1500
	// 	})
	// 	return
	// }
	// const phoneReg = /^1[3456789]\d{9}$/
	// if (!phoneReg.test(user.phone)) {
	// 	uni.showToast({
	// 		title:'请输入正确的手机号',
	// 		icon:'none',
	// 		duration: 1500
	// 	}) // 如果不是有效的手机号码，则删除最后一位数字
	// 	return
	// }
	// 判断省市区是否选择
	let diqu = reactive({
		sheng:'',
		shi:'',
		qu:'',
	})
	if(page_information.province !=''){
		diqu.sheng = page_information.province
		diqu.shi = page_information.city
		diqu.qu = page_information.district
	}
	//开始请求或者跳转
	// if(tan_value.value === 1){
	// 	// 转让出租、
	// 	let params = reactive({
	// 		name:user.name,
	// 		phone:user.phone,
	// 		user_id:user.user_id,
	// 		province:page_information.province,
	// 		city:page_information.city,
	// 		county:page_information.district,
	// 		channel_no:user.channel_no
	// 	})
	// 	onGotApiData('/api/app/shop_transfer/v1/add_base','POST',params,add_zrbase)
	// }else{
		// 求租的、
		let params = reactive({
			phone:user.phone,
			user_id:user.user_id,
			province:diqu.sheng ,
			city:diqu.shi,
			county:diqu.qu,
			channel_no:user.channel_no
		})
		onGotApiData('/api/app/shop_rent/v1/add_base','POST',params,add_qzbase)
	// }
	// 关闭弹框
	popup.value.close()
}	
//店铺转让返回的结果
const add_zrbase = (result) =>{
	console.log('店铺转让基础返回的结果',result)	
	if(result.code == 401){
		// uni.showToast({
		// 	title:'信息提交成功',
		// 	icon:'none',
		// 	duration: 1500
		// })
		// 跳转发布页面
		uni.navigateTo({
			url: '/pages/zr_secondary/zr_secondary?shop_id=' + result.data.shop_id +'&phone=' + user.phone
		});
	}else{
		uni.showToast({
			title:result.message,
			icon:'none',
			duration: 1500
		})
	}
}
// 店铺求租返回的结果
const add_qzbase = (result)=>{
	console.log('店铺求租基础返回的结果',result)
	if(result.code == 401){
		// uni.showToast({
		// 	title:'信息提交成功',
		// 	icon:'none',
		// 	duration: 1500
		// })
		// 先把求租的店铺id存起来然后跳转使用
		user.qz_shopid = result.data.shop_id 
		// 请求产品
		product()
	}else{
		uni.showToast({
			title:result.message,
			icon:'none',
			duration: 1500
		})
	}

} 
// 请求求租产品的接口
let product_value  = reactive({
		// 全部
		required:{},
		// 选中的产品
		default:{},
		// 计算总价格
		allmoney:'',
		dier:{}
	})
const product = () =>{
	let params = reactive({})
	params.channel_no = user.channel_no
	console.log("params",params)
	onGotApiData('/api/app/product/rent/v1/list','GET',params,product_result)
}
// 求租会员页面产品请求的结果
const product_result = (result) => {
	console.log('我是产品结果1',result)
	// 产品请求回来之后，弹框
	paypopup.value.open('bottom')
	product_value.required = result
	// 默认选中第一个	
	product_value.default = result[0]
		// 做判断使用
	product_value.dier = result[1]
	product_value.allmoney = Number(product_value.default.now_money)
	console.log("产品",product_value)
}
// 点击产品选择框事件
const cpdefault = (item) =>{
	addClick("H5会员页",item.product_name)
	product_value.default = item
	console.log("我选中的是",product_value.default)
	product_value.allmoney = Number(product_value.default.now_money)
}
// 点击支付
const pay_qz = () =>{
	let params = reactive({
		product_id:product_value.default.id,
		pay_type:'WX_XCX',
		channel_no:user.channel_no,
		phone:user.phone,
		wxOpenId:user.openid,
		shop_type:tan_value.value,
		shop_id:user.qz_shopid,
	})
	onGotApiData('/api/app/order/rent/v1/create','POST',params,pay_val)
}
// 创键订单返回的值
const pay_val = (result)=>{
	console.log('支付请求结果',result)
		// 唤起微信支付
	requestPayment(result)
}
// 唤起支付
const requestPayment = (result) => {
	// 唤起微信支付
	wx.requestPayment({
		timeStamp: '' + result.timestamp, // 时间戳，自行生成
		nonceStr: '' + result.noncestr, // 随机字符串，自行生成
		package: 'prepay_id=' + result.prepayid, // 统一下单接口返回的prepay_id参数值
		signType: 'MD5', // 签名算法，固定值为MD5
		paySign: '' + result.sign, // 签名，自行生成
		success: function (res) {
		// 支付成功回调
		console.log('支付成功', res);
		uni.showToast({
				title: '支付成功',
				icon: 'none',
				duration: 2000
			});
			// 关闭弹框
			colse_paypopup()
		// 跳转发布页面
		uni.navigateTo({
			url: '/pages/qz_secondary/qz_secondary?shop_id=' + user.qz_shopid
		});

		return
		},
		fail: function (res) {
		// 支付失败回调
		console.log('支付失败', res);
			uni.showToast({
				title: '支付失败',
				icon: 'none',
				duration: 2000
			});
		}
	});
}
// 控制展示列表的变量
const display_store = ref(0)
	//第一次点击求租标识
let isFirstRentClickone = ref(true);
let isFirstRentClickonee = ref(true);
let isFirstRentClicktwo = ref(true);
// 点击切换展示列表
const show_shop = (num)=>{
		// 关闭类型的弹框
		porpshow.value = 0
	// 每次点击别的地方都重置为0
	page_information.pageone = 1
	page_information.pageonecz = 1
	page_information.pagetwo = 1
		// 每次点击别的地方都重置为0
	// page_information.pageone = 1
	// page_information.pagetwo = 1
	display_store.value = num
	 if(num == 0){
		addClick('小程序_店铺转让Tab')
		// 调用转让店铺信息的接口
		// lists_post()
	}else if(num == 1){
		addClick('小程序_出租信息Tab')
		// 调用求租店铺信息的接口
		// listtwo_post()
	}else if(num == 2){
		addClick('小程序_求租信息Tab')
		// 调用求租店铺信息的接口
		// listtwo_post()
	}
	// 下面两个判断未来做切换缓存
	if(num == 0 && isFirstRentClickone.value){
		isFirstRentClickone.value = false
		// 调用求租店铺信息的接口
		lists_post()
	}
	if(num == 1 && isFirstRentClickonee.value){
		isFirstRentClickonee.value = false
		// 调用求租店铺信息的接口
		listone_post()
	}
	if(num == 2 && isFirstRentClicktwo.value){
		isFirstRentClicktwo.value = false
		// 调用求租店铺信息的接口
		listtwo_post()
	}
}
// 租金和面积的值
const zhujin = reactive([
	{id:'0',name:'不限'},
	{id:'1',name:'2000以下'},
	{id:'2',name:'2000-3000'},
	{id:'3',name:'3000-5000'},
	{id:'4',name:'5000-10000'},
	{id:'5',name:'10000以上'},
])
const mianji = reactive([
	{id:'0',name:'不限'},
	{id:'1',name:'小于50m²'},
	{id:'2',name:'50-200m²'},
	{id:'3',name:'200-600m²'},
	{id:'4',name:'600-800m²'},
	{id:'5',name:'800-1000m²'},
	{id:'6',name:'1000m²以上'},
])

// 点击内部的选择某一个值
let select = ref({
	active_type:{},
	active_money:{},
	active_area:{},

})

// 首页基础店铺数据类型
let title_type  = ref([])
let active_title_type = reactive({
	value:0,
	active:{}
})

// 店铺子选择类型的名称
let search_son_selse = reactive({
	selse_shop:'店铺类型',
	selse_area:'租金',
	selse_rent:'面积',
})

// 首页基础店铺数据类型的接口
const home_type = () =>{
	let params = reactive({
		type : 1,
		grade:1,
	})
	console.log("params",params)
	onGotApiData('/api/app/other/type_list','GET',params,home_type_value)
}
// 首页基础店铺数据类型的结果
const home_type_value = (result) => {
	result.forEach((value,index,Array)=>{
		if(value.childList){
			Array[index].childList = JSON.parse(value.childList)
		}
	})
	console.log('首页基础数据类型的接口',result)
	title_type.value = result.map(item => {
		return {
			...item,
			value: item.id,
		}
	})
	// 下方小横款选中的值
	active_title_type.value =  1;
	console.log('active_title_type.value',active_title_type.value)
	active_title_type.active = result[0]
	page_information.shop_first_type = active_title_type.active.id
	console.log("我首页店铺类型选中的值",active_title_type.active)
	// 调用初始转让列表(获取到店铺大id)
	// if(page_information.city != ''){
	// 	lists_post()
	// }
}
// 店铺类型的上方点击事件
const tabClick = (item) =>{
	// 判断一下有没有userid
	if(user.openid =='' || user.user_id==''){
		uni.showToast({
				title: '请先登录哦',
				icon: 'none',
				duration: 2000
			});
		// 跳转到我的
		gotomy()
		return
	}

	// 没有吧下面的求租判断第一次请求的情况赋值为请求
	isFirstRentClickone.value = true
	isFirstRentClickonee.value = true
	isFirstRentClicktwo.value = true

	console.log('当前点击选中的值', item, active_title_type.value)
	// 展示弹框的时候用
	active_title_type.active = item
	page_information.shop_first_type = active_title_type.active.id
		// 页面复制为第一页
	page_information.pageone = 1
	page_information.pageonecz = 1
	page_information.pagetwo = 1
	// 点击上方的某一个大类型的时候值清空
	select.value.active_type = {}
	select.value.active_money = {}
	select.value.active_area = {}
	page_information.shop_type = ''
	page_information.rent = ''
	page_information.shop_area = ''
	search_son_selse.selse_shop = '店铺类型'
	search_son_selse.selse_area = '租金'
	search_son_selse.selse_rent = '面积'
	if(display_store.value == 0){
		// 调用转让店铺信息的接口
		// throttle(lists_post)()
		fn1()
	}else if(display_store.value == 1){
	// 调用出租店铺信息的接口
		// throttle(listone_post)()
		fn2()
		// listone_post()
	}else if(display_store.value == 2){
		// 调用求租店铺信息的接口
		// throttle(listtwo_post)()
		fn3()
	}

	// 判断一下有没有已经支付的订单
	if(!user.order_count){
		// uni.showToast({
		// 		title: '请先发布信息哦',
		// 		icon: 'none',
		// 		duration: 2000
		// 	});
			// console.log('1111')
			popup.value.open('bottom')
		return
	}

}
// 点击下方的店铺子类型选择
const onclicktype = (item) =>{
	console.log("店铺子类型选择",item)
	// 每次点击别的区域都重置为1
	page_information.pageone = 1
	page_information.pageonecz = 1
	page_information.pagetwo = 1

	// 选中子类型的某一个对象
	select.value.active_type  = item
	page_information.shop_type =  item.name
	search_son_selse.selse_shop = item.name
}
// 点击下方的金额选择
const onclickmoney = (item) =>{
	console.log("下方的金额选择",item)
	// 每次点击别的区域都重置为1
	page_information.pageone = 1
	page_information.pageonecz = 1
	page_information.pagetwo = 1

	select.value.active_money = item
	page_information.rent = item.id
	search_son_selse.selse_area = item.name

}
//点店铺的选择
const onclickarea = (item) =>{
	console.log("店铺面积的选择",item)
	// 每次点击别的区域都重置为1
	page_information.pageone = 1
	page_information.pageonecz = 1
	page_information.pagetwo = 1

	select.value.active_area = item
	page_information.shop_area = item.id
	search_son_selse.selse_rent = item.name
}
// 滑动模块
const scrollRef = ref(null)
// 最初的展示值
let porpshow = ref(0)
// 点击展示类型还是面积金额
const click_type = (value) =>{
	// scrollRef.scrollTop= 999;
	console.log('我是点击事件',value)
	porpshow.value = value
	// scrollToBottom();
	// 点击两次就取消
	// if(porpshow.value = value){
	// 	porpshow.value = 0
	// }
}
// 点击弹框取消按钮
const close_type = () => {
	porpshow.value = 0
}
// 小类型的选择框中点击确定
const post_list = () =>{
	// 下拉框隐藏
	porpshow.value = 0

	// 判断一下有没有userid
	if(user.openid =='' || user.user_id==''){
		uni.showToast({
				title: '请先登录哦',
				icon: 'none',
				duration: 2000
			});
		// 跳转到我的
		gotomy()
		return
	}
	// 判断一下有没有已经支付的订单
	if(!user.order_count){
		// uni.showToast({
		// 		title: '请先发布信息哦',
		// 		icon: 'none',
		// 		duration: 2000
		// 	});
			// console.log('1111')
			popup.value.open('bottom')
		return
	}

	if(display_store.value == 0){
		// 调用初始转让列表
			lists_post()
	}else if(display_store.value == 1){
		// 调用初始出租列表
			listone_post()
	}
} 
// h5小程序绑定
const binding = () =>{
	// page_information.serach_value = link_id
	wx.login({
		success: function(res) {
			console.log('我是code',res.code);//这里的返回值里面便包含code
			// 调用绑定接口
			bindingxcx(res.code)
		}
	})
}
// 调用绑定接口
const bindingxcx = (code) =>{
	let params = reactive({
		code : code,
		link_id:props.link_id,
		ip_id:props.ip_id
	})
	console.log("params",params)
	onGotApiData('/api/app/xcx/v1/user_binding','POST',params,bindingxcx_value)
}
	// h5小程序绑定成功
const bindingxcx_value = (result) => {
	console.log('h5小程序绑定成功',result)
}
	// 首页基础数据变量
let foundation_value = reactive({
	total_user:0,
	yesterday_user:0,
	total_transfer:0,
	yesterday_transfer:0,
	total_rent:0,
	yesterday_rent:0,

});
	// 首页基础数据接口
const foundation = () =>{
	let params = reactive({
		channel_no : 'XCX_PPZ_V1'		 
	})
	console.log("params",params)
	onGotApiData('/api/app/home/base_data','GET',params,foundation_num)
}
	// 首页基础数据接口的结果
const foundation_num = (result) => {
	console.log('首页基础数据接口的结果',result)
	foundation_value.total_user = result.total_user
	foundation_value.yesterday_user = result.yesterday_user
	foundation_value.total_transfer = result.total_transfer
	foundation_value.yesterday_transfer = result.yesterday_transfer
	foundation_value.total_rent = result.total_rent
	foundation_value.total_usyesterday_renter = result.yesterday_rent

	// page_information.region = result.region
	if( page_information.city == '不限'&&page_information.region =='不限'){
		page_information.region = result.region
		page_information.city = result.city
		console.log('地址',page_information.city)
		// 调用初始转让列表
		lists_post()
	}
}
// 获取手机的号的弹框api
const getPhoneNumber = (e) =>{
	console.log('获取手机的code',e.detail.code)  // 动态令牌
	if(e.detail.code){
		if(user.phone){
			// 用户信息美誉手机号的情况
			automaticphone(e.detail.code)
		}else{
			// 用户信息有手机号的情况
			geiautomaticphone(e.detail.code)
		}
	}
	// 关闭弹框
	colse_get_phone()
}
// 不绑定手机号
const automaticphone = (code)=>{
	let params = reactive({
		code:code,
	})	
	onGotApiData('/api/app/xcx/v1/getuserphonenumber',"GET",params,getphone_value)	
}
	// 绑定手机号
const geiautomaticphone = (code)=>{
	let params = reactive({
		user_id:user.user_id,
		code:code,
	})	
	onGotApiData('/api/app/xcx/v1/getuserphonenumber',"GET",params,getphone_value)	
}
// 获取手机号的结果
const getphone_value= (result)=>{
	console.log("手机号",result.openlink.phoneNumber)
	user.phone = result.openlink.phoneNumber
	// 存起来
	// 调用查询订单信息
	get_code()
}
	// 店铺地址全部
let oldAddressList = reactive(null)
const newAddressList = reactive([
	[],
	[],
	[]
])
	// 最后显示的值
const addressList = reactive(['北京市', '北京市', '东城区'])
const tempAddressList = reactive([])
	// 列表中的值
const multiIndex = reactive([])
	// 取消时候触发的
const initMultiIndex = () => {
	console.log('addressList',addressList)
	if (!addressList) {
		multiIndex[0] = 0;
		multiIndex[1] = 0;
		multiIndex[2] = 0;
		return;
	}
	const province = addressList[0];
	const city = addressList[1];
	const area = addressList[2];	

	console.log("oldAddressList=", oldAddressList)

	const provinceObj = oldAddressList.find(item => item.label === province);
	const provinceIndex = oldAddressList.findIndex(item => item.label === province);
	console.log('我是啥',provinceObj,provinceIndex)

	const cityObj = provinceObj.children.find(item => item.label === city);
	const cityIndex = provinceObj.children.findIndex(item => item.label === city);
	console.log('我是啥2',cityObj,cityIndex)

	const areaObj = cityObj.children.find(item => item.label === area);
	const areaIndex = cityObj.children.findIndex(item => item.label === area);
	console.log('我是啥3',areaObj,areaIndex)

	multiIndex[0] = provinceIndex
	multiIndex[1] = cityIndex
	multiIndex[2] = areaIndex
	console.log('multiIndex是列表',multiIndex)

}
	// 把js中的数据遍历到这个数组上去
const initAddress = () => {

	initMultiIndex();

	newAddressList[0] = oldAddressList.map((item, index) => {
		var obj = {
			label: item.label,
			value: item.value
		}
		return obj
	})
	newAddressList[1] = oldAddressList[multiIndex[0]].children.map((item, index) => {
		var obj = {
			label: item.label,
			value: item.value
		}
		return obj
	})
	newAddressList[2] = oldAddressList[multiIndex[0]].children[multiIndex[1]].children.map(
		(item, index) => {
			var obj = {
				label: item.label,
				value: item.value
			}
			return obj
		})

	console.log('newAddressList:', newAddressList);
}
	// value值改变时候触发（点击确认的时候）
const pickerChange = (e) => {
	console.log('aaa')	
	// 关闭弹框
	porpshow.value = 0
	console.log('pickerChange:', e.detail.value);
	const [provinceIndex, cityIndex, areaIndex] = e.detail.value;
	const province = newAddressList[0][provinceIndex].label;
	const city = newAddressList[1][cityIndex].label;
	const area = newAddressList[2][areaIndex].label;
	console.log(province + '-' + city + '-' + area);
	// baseFormData.province = province
	// baseFormData.city = city
	page_information.province = province
	page_information.city = city
	page_information.region  = area
	addressList[0] = province
	addressList[1] = city
	addressList[2] = area

				// 做缓存发布时候用
	uni.setStorageSync('province', province);
	uni.setStorageSync('city',city);
	uni.setStorageSync('district',area);
	console.log('选择地区点击确认时候的值',display_store.value)

		// 每次点击别的区域都重置为1
	page_information.pageone = 1
	page_information.pageonecz = 1
	page_information.pagetwo = 1
	// 将上方列表的请求赋值为能请求
	isFirstRentClickone.value = true
	isFirstRentClickonee.value = true
	isFirstRentClicktwo.value = true

	if(display_store.value == 0){
		// 调用转让店铺信息的接口
		lists_post()
	}else if(display_store.value == 1){
		// 调用c出租店铺信息的接口
		listone_post()
	}else if(display_store.value == 2){
		// 调用求租店铺信息的接口
		listtwo_post()
	}
}
// 某一列值改变时候触发
const pickerColumnchange = (e) => {
	console.log('pickerColumnchange:', e);
	// 第几列滑动
	// console.log(e.detail.column);
	// 第几列滑动的下标
	// console.log(e.detail.value)
	// 第一列滑动
	if (e.detail.column === 0) {
		multiIndex[0] = e.detail.value;

		newAddressList[1] = oldAddressList[multiIndex[0]].children.map((item,
			index) => {
			// console.log('item:',item);
			var obj = {
				label: item.label,
				value: item.value
			}
			return obj
		})
		multiIndex[1] = 0
		multiIndex[2] = 0;
		newAddressList[2] = oldAddressList[multiIndex[0]].children[multiIndex[1]]
			.children
			.map((item, index) => {
				// console.log('item:',item);
				var obj = {
					label: item.label,
					value: item.value
				}
				return obj
			})

	}else if (e.detail.column === 1) {
		multiIndex[1] = e.detail.value
		multiIndex[2] = 0;
		newAddressList[2] = oldAddressList[multiIndex[0]].children[multiIndex[1]]
			.children
			.map((item, index) => {
				// console.log('item:',item);
				var obj = {
					label: item.label,
					value: item.value
				}
				return obj
			})

	}else if (e.detail.column === 2) {
		multiIndex[2] = e.detail.value
	}
}
	// 节点被触发
const popupopened = () =>{
	console.log('节点被触发')
}
// 取消时候触发
const pickerCancel = () => {
		// 关闭弹框
	porpshow.value = 0
	// initMultiIndex();
	console.log('我取消了城市选择器')
}
// 最新转让店鋪列表
let lists = ref([]);
	// 请求会员信息的接口
const lists_post = () =>{
	// 列表请求数量 +1
	// page_information.getNum ++
	console.log("装让店铺请求的页数",page_information.getNum)
	// 参数
	let params = reactive({
		page : page_information.pageone,
		size: 10,
		user_id: '',
		region:page_information.region,
		city:page_information.city,
		shop_first_type:page_information.shop_first_type,
		// 商铺类型（中文）
		shop_type:page_information.shop_type,
		// 租金
		rent:page_information.rent,
		shop_area:page_information.shop_area,
		// 搜索
		serach_value:page_information.serach_value,
		sub_type:1,
		// 请求数字
		// request_count: page_information.getNum,
		// foundation_value.region
	})
	console.log("params",params)
	onGotApiData('/api/app/shop_transfer/page_list_v2','GET',params,lists_value)
}
// 请求的结果
const lists_value = (result) => {
	console.log('list',result)
	if(result.list){
		lists.value = [...result.list]
	}
	// 总条数
	page_information.shop_assemble = result.total
	console.log('lists_value请',result.total)
	console.log('lists_value请求成功',lists)
	display_store.value = 0
	page_information.showtext ='加载更多店铺中...'
	// 下滑中,展示上方
	hader_show.value = 1
}
// 最新出租店鋪列表
let listone = ref([]);
	// 最新店鋪列表接口
const listone_post = () =>{
	let params = reactive({
		page : page_information.pageone,
		size: 10,
		// region:page_information.region
		region:page_information.region,
		city:page_information.city,
		shop_first_type:page_information.shop_first_type,
		// 商铺类型（中文）
		shop_type:page_information.shop_type,
		// 租金
		rent:page_information.rent,
		shop_area:page_information.shop_area,
		// 搜索
		serach_value:page_information.serach_value,
		sub_type:2,
	})
	console.log("params",params)
	onGotApiData('/api/app/shop_transfer/page_list_v2','GET',params,listone_value)
}
// 店铺出租的结果
const listone_value = (result) => {
	listone.value = result.list
	// 总条数
	page_information.shop_assembletwo = result.total
	console.log('lists_value请',result.total)
	console.log('lists_value请求成功',result.list)
			// 展示出租的列表
	display_store.value = 1
	page_information.showtextone ='加载更多店铺中...'
	// 滑动隐藏的内容展示出来
	hader_show.value = 1
		// if(result.total == 0){
			// display_store.value = 0
			// page_information.showtext ='加载更多店铺中...'
		// }
}
// 最新求租店鋪列表
let listtwo = ref([]);

const listtwo_post = () =>{
	let params = reactive({
		page : page_information.pagetwo,
		size: 10,
		user_id: '',
		shop_first_type:page_information.shop_first_type,
		region:page_information.region,
		city:page_information.city,
		// 搜索
		serach_value:page_information.serach_value,
	}) 
	console.log("params",params)
	onGotApiData('/api/app/shop_rent/page_list_v2','GET',params,listtwo_value)
}
// 最新求租店铺请求的结果
const listtwo_value = (result) => {
		// 总条数
	page_information.rent_assemble = result.total
	listtwo.value = result.list
	console.log('listtwo_value请求成功',listtwo.value)	
	display_store.value = 2
	page_information.showtexttwo = '加载更多店铺中...'
	// 下滑中,展示上方
	hader_show.value = 1
}
// 下拉刷新
// onPullDownRefresh(()=> {
// 	if(display_store.value == 2){
// 		let params = reactive({
// 			page : page_information.pagetwo,
// 			size: 10,
// 			user_id: ''
// 		})
// 		console.log("params",params)
// 		onGotApiData('/api/app/shop_rent/page_list','GET',params,listtwo_value)
		
// 		// 最新求租店铺请求的结果
// 		const listtwo_value = (result) => {
// 			listtwo.value = result.list
// 			console.log('listtwo_value请求成功',listtwo.value)
// 		}
// 	}else{
// 		let params = reactive({
// 			page : page_information.pagetwo,
// 			size: 10,
// 			user_id: ''
// 		})
// 		console.log("params",params)
// 		onGotApiData('/api/app/shop_rent/page_list','GET',params,listtwo_value)
		
// 		// 最新求租店铺请求的结果
// 		const listtwo_value = (result) => {
// 			listtwo.value = result.list
// 			console.log('listtwo_value请求成功',listtwo.value)
// 		}

// 	}
// 	// 停止下拉刷新动画
// 	uni.stopPullDownRefresh();
// })
// 下拉刷新
// const upperone = () =>{
// 	console.log('下拉刷新最新数据')
// 	    // 判断是否正在加载中，避免重复触发加载
// 	if (page_information.showup) {
//         return;
//       }
// 	// 显示加载中提示
// 	page_information.showup = true
// 	// 每次点击别的区域都重置为1
// 	page_information.pageone = 1
// 	// page_information.pagetwo = 1
// 	// 将上方列表的请求赋值为能请求
// 	isFirstRentClickone.value = false
// 	// isFirstRentClicktwo.value = true	
// 	// 请求转让列表、
// 		lists_post()
// 		// 关闭提示
// 		setTimeout(()=>{
// 		page_information.showup = false
// 	  },1200)
// 	}

//滑动隐藏的内容展示出来
// 最上方的是否隐藏
let hader_show = ref(1)

// 滚动距离的初始值
let scroll_value = ref(0)
let scrollone_value = ref(0)
let scrolltwo_value = ref(0)
// 滚动条滚动时候触发
const scroll =(e)=>{
	// console.log('滚动条的值',e.detail.scrollTop)
	if((e.detail.scrollTop - scroll_value.value) > 8){
		// 上划中，隐藏上方
		hader_show.value = 0
	}else if((scroll_value.value -e.detail.scrollTop) > 16){
		// 下滑中,展示上方
		hader_show.value = 1
	}
	// 赋值
	scroll_value.value = e.detail.scrollTop
}
// 出租滚动条滚动时候触发
const scrollcz =(e)=>{
	// console.log('滚动条的值',e.detail.scrollTop)
	if((e.detail.scrollTop - scrollone_value.value) > 8){
		// 上划中，隐藏上方
		hader_show.value = 0
	}else if((scrollone_value.value -e.detail.scrollTop) > 16){
		// 下滑中,展示上方
		hader_show.value = 1
	}
	// 赋值
	scrollone_value.value = e.detail.scrollTop
}
// 滚动条滚动时候触发
const scrolltwo =(e)=>{
	// console.log('滚动条的值',e.detail.scrollTop)
	if((e.detail.scrollTop - scrolltwo_value.value) > 8){
		// 上划中，隐藏上方
		hader_show.value = 0
	}else if((scrolltwo_value.value -e.detail.scrollTop) > 16){
		// 下滑中,展示上方
		hader_show.value = 1
	}
	// 赋值
	scrolltwo_value.value = e.detail.scrollTop
}

// 上拉加载
const loadMore = () => {
      // 判断是否正在加载中，避免重复触发加载
      if (page_information.showLoading) {
        return;
      }
	// 显示加载中提示
      page_information.showLoading = true
	//   计算当前数组有多少对象
	  page_information.objectCount = lists.value.filter(item => typeof item === 'object').length;
	//   如果已加载全部直接返回
	  if( page_information.objectCount >= page_information.shop_assemble){
		console.log("比较",page_information.objectCount,page_information.shop_assemble)
		page_information.showtext = '没有更多数据了...'
			setTimeout(()=>{
					// 隐藏加载中提示
					page_information.showLoading = false; 
			},2000)
		return
	  }

	//   每次请求页数+1
	  page_information.pageone = page_information.pageone + 1
      // 模拟异步请求数据
      setTimeout(function(){
        // 获取到的新数据
		let params = reactive({
			page : page_information.pageone,
			size: 10,
			user_id: '',
			region:page_information.region,
			city:page_information.city,
					// 商铺一级分类（传id）
			shop_first_type:page_information.shop_first_type,
			// 商铺类型（中文）
			shop_type:page_information.shop_type,
			// 租金
			rent:page_information.rent,
			shop_area:page_information.shop_area,
			// 搜索
			serach_value:page_information.serach_value,
			sub_type:1,
		})
		console.log("params",params)
		onGotApiData('/api/app/shop_transfer/page_list_v2','GET',params,goto_lists)

        // 将新数据追加到数据列表中
      }, 1000);
		// 会员页面产品请求的结果
		const goto_lists = (result) => {
			console.log('分页列表',result)
			lists.value.push(...result.list)
			console.log('goto_lists请求成功',lists.value)
			// 隐藏加载中提示
			page_information.showLoading = false; 
		}
	}
// 求租下拉刷新
const uppertwo =() =>{
	console.log('下拉刷新最新数据')
	// 判断是否正在加载中，避免重复触发加载
	if (page_information.showuptwo) {
		return;
	}
	// 显示加载中提示
	page_information.showuptwo = true
	// 每次点击别的区域都重置为1
	// page_information.pageone = 1
	page_information.pagetwo = 1
	// 将上方列表的请求赋值为能请求
	// isFirstRentClickone.value = false
	isFirstRentClicktwo.value = false	
	// 请求转让列表、
	listtwo_post()
	// 关闭提示
	setTimeout(()=>{
		page_information.showuptwo = false
	},1200)
}
// 出租店铺上拉加载
const loadMoreone = () => {
	// 判断是否正在加载中，避免重复触发加载
	if (page_information.showLoadingone) {
	return;
	}
		// 显示加载中提示
	page_information.showLoadingone = true
//   计算当前数组有多少对象
	page_information.objectCounttwo = listone.value.filter(item => typeof item === 'object').length;
//   如果已加载全部直接返回
	if( page_information.objectCounttwo >= page_information.shop_assembletwo){
	console.log("比较",page_information.objectCounttwo,page_information.shop_assembletwo)
	page_information.showtextone = '没有更多数据了...'
		setTimeout(()=>{
				// 隐藏加载中提示
				page_information.showLoadingone = false; 
		},2000)
		return
	}

//   每次请求页数+1
	page_information.pageonecz = page_information.pageonecz + 1
	// 模拟异步请求数据
	setTimeout(function(){
	// 获取到的新数据
	let params = reactive({
		page : page_information.pageonecz,
		size: 10,
		// region:page_information.region
		region:page_information.region,
		city:page_information.city,
			// 商铺一级分类（传id）
		shop_first_type:page_information.shop_first_type,
		// 商铺类型（中文）
		shop_type:page_information.shop_type,
		// 租金
		rent:page_information.rent,
		shop_area:page_information.shop_area,
		// 搜索
		serach_value:page_information.serach_value,
		sub_type:2,
	})
	console.log("params",params)
	onGotApiData('/api/app/shop_transfer/page_list_v2','GET',params,goto_listone)

	// 将新数据追加到数据列表中
	}, 1000);
	// 会员页面产品请求的结果
	const goto_listone = (result) => {
		console.log('分页列表',result)
		listone.value.push(...result.list)
		console.log('goto_lists请求成功',listone.value)
		// 隐藏加载中提示
		page_information.showLoadingone = false; 
		
	}
}
// 求租店铺上拉加载
const loadMoretwo = () =>{
		// 判断是否正在加载中，避免重复触发加载
		if (page_information.showLoadingtwo) {
			return;
		}
		// 显示加载中提示
	page_information.showLoadingtwo = true
	//   计算当前数组有多少对象
	page_information.rent_count = listtwo.value.filter(item => typeof item === 'object').length;
	//   如果已加载全部直接返回
	if( page_information.rent_count >= page_information.rent_assemble){
		console.log("比较",page_information.rent_count,page_information.rent_assemble)
		page_information.showtexttwo = '没有更多数据了...'
			setTimeout(()=>{
					// 隐藏加载中提示
					page_information.showLoadingtwo = false; 
			},2000)
		return
	}
	//   每次请求页数+1
	page_information.pagetwo = page_information.pagetwo + 1
	// 模拟异步请求数据
	setTimeout(function(){
		// 获取到的新数据
		let params = reactive({
			page : page_information.pagetwo,
			size: 10,
			user_id: '',
			region:page_information.region,
			city:page_information.city,
					// 搜索
			serach_value:page_information.serach_value,
		})
		console.log("params",params)
		onGotApiData('/api/app/shop_rent/page_list_v2','GET',params,goto_listtwo)

		// 将新数据追加到数据列表中
	}, 1000);
		// 会员页面产品请求的结果
		const goto_listtwo = (result) => {
			console.log('分页列表',result)
			listtwo.value.push(...result.list)
			console.log('goto_listtwo请求成功',listtwo.value)
			// 隐藏加载中提示
			page_information.showLoadingtwo = false; 
			
		}
}
// 防抖
const fn1 = throttle(lists_post)
const fn2 = throttle(listone_post)
const fn3 = throttle(listtwo_post)

// 点击查询求租店铺
const search = (item) =>{
	console.log("id",item.id)
	user.qz_shopid = item.id
	// 判断一下有没有userid
	if(user.openid =='' || user.user_id==''){
		uni.showToast({
				title: '请先登录哦',
				icon: 'none',
				duration: 2000
			});
		// 跳转到我的
		gotomy()
		return
	}
	uni.navigateTo({
		url: '/pages/search_shop/search_shop?id=' + `${user.qz_shopid}`,
	});
	// 调用查询次数接口
	// lookxq()
} 
// 点击转让店铺详情
const todetails = (item) =>{
	console.log("id",item.id)
	user.zr_shopid = item.id
	// 判断一下有没有userid
	if(user.openid =='' || user.user_id==''){
		uni.showToast({
				title: '请先登录哦',
				icon: 'none',
				duration: 2000
			});
		// 跳转到我的
		gotomy()
		return
	}
	uni.navigateTo({
		url: '/pages/transfer/transfer?id=' + `${user.zr_shopid}`,
	});

	// 调用查询次数接口
	//  lookxq()
}
// 请求接口查询会员每天次数
const lookxq = () =>{
	let params = reactive({
		user_id:user.user_id,
		type:'view_residue_count',
	})
	onGotApi('/api/app/xcx/v1/vip_check','GET',params,lookxqval)
}
const lookxqval = (result)=>{
	console.log("有无查看权限",result.code)
	if(result.code != 200){
		uni.showToast({
				title: '暂无查看权限',
				icon: 'none',
				duration: 2000
			});
			// 弹框展示出来
		popup.value.open('bottom')
	}else if(display_store.value == 2){
		uni.navigateTo({
			url: '/pages/search_shop/search_shop?id=' + `${user.qz_shopid}`,
		});
	}else{
		uni.navigateTo({
			url: '/pages/transfer/transfer?id=' + `${user.zr_shopid}`,
		});
	}
}

// 点击定位
const onpositioning = () =>{
	uni.getLocation({
		type: 'gcj02',
		success: function(res) {
			console.log("返回的全部",res)
			const latitude = res.latitude; // 纬度
			const longitude = res.longitude; // 经度
			const speed = res.speed; // 速度
			const accuracy = res.accuracy; // 精确度
			console.log("经度",longitude)
			console.log("纬度",latitude)
			// 在这里可以根据获取到的定位信息进行相应的处理
			map(latitude,longitude)
		},
		fail: function(err) {
			console.log('获取定位失败', err);
			// 在这里可以处理获取定位失败的情况
				uni.showModal({
					content:'检测到您没有打开位置权限 是否设置打开',
					confirmText:'确认',
					cancelTexr:'取消',
					success:(res)=>{
						if(res.confirm){
							uni.openSetting({
								success: function(res) {
									if (res.authSetting['scope.userLocation']) {
										// 用户在设置页面授权了定位权限
										console.log('用户已授权定位权限')
										wx.reLaunch({
											url: '/pages/index/index',
											success() {
												console.log('页面重启成功');
											},
											fail(err) {
												console.log('页面重启失败', err);
											}
										});
									} else {
										// 用户在设置页面未授权定位权限
										console.log('用户未授权定位权限')
									}
								}
							})
						}else{
							uni.showToast({
								title:'开启定位权限 才可以重新定位哦',
								icon:'none'
							})
						}
					}
				})


		}
	});
}
// 高德的逆地理编码
const map = (latitude,longitude) =>{
	const map_value = '' + longitude + ',' + latitude
	wx.request({
          url: 'https://restapi.amap.com/v3/geocode/regeo',
          data: {
            key: '4c1e3105931c62c528ddf8c5c1d49c7c',
            location: map_value
          },
          success: (res) => {
            const address = res.data.regeocode.formatted_address;
            console.log("地图返回的全部",res);
			console.log("地图返回的地址",address);
			// 省市区（为了传给发布页）
			page_information.province = res.data.regeocode.addressComponent.province
			page_information.city = res.data.regeocode.addressComponent.city
			// 直辖市的情况
			if(res.data.regeocode.addressComponent.province == '重庆市' || res.data.regeocode.addressComponent.province == '北京市'|| res.data.regeocode.addressComponent.province == '上海市'|| res.data.regeocode.addressComponent.province == '天津市'){
				page_information.city = res.data.regeocode.addressComponent.province
			}
				// 获取到的区，下面也有
			page_information.district = res.data.regeocode.addressComponent.district
			page_information.region = res.data.regeocode.addressComponent.district
			console.log("地图返回的地址",res.data.regeocode.addressComponent.district);
			if(res.data.regeocode.addressComponent.district == []|| res.data.regeocode.addressComponent.district == ''){
				page_information.district = res.data.regeocode.addressComponent.township
				page_information.region = res.data.regeocode.addressComponent.township
			}
			// 做缓存发布时候用
			uni.setStorageSync('province', page_information.province);
			uni.setStorageSync('city', page_information.city);
			uni.setStorageSync('district',page_information.district);
			addressList[0] =  page_information.province
			addressList[1] = page_information.city
			addressList[2] = page_information.district
			// 把之前ip渠道的值置空
			// lists.value = []
			// 调用转让店铺信息的接口
			// lists_post()
				// 每次点击别的区域都重置为1
			page_information.pageone = 1
			page_information.pageonecz = 1,
			page_information.pagetwo = 1

			if(display_store.value == 0){
			// 调用转让店铺信息的接口
				lists_post()
			}else if(display_store.value == 1){
				// 调用出租店铺信息的接口
				listone_post()
			}else if(display_store.value == 2){
				// 调用求租店铺信息的接口
				listtwo_post()
			}
          }
        });
}

</script>

<style lang="scss" scoped>
	.out-box {
		width: 100vw;
		height: 100vh;
		max-width: 750rpx;
		margin: 0 auto;
		overflow: hidden;
		font-family: '思源黑体';
		background: linear-gradient(to bottom, #ff3333, #FFFFFF) no-repeat;
		// background-position: top;
		background-size: 100% 40%;
		width: 750rpx auto;
		.hader{
			width: 100%;
			height: 110rpx;
			text-align: center;
			font-family: Arial, Helvetica, sans-serif;
			font-weight: 600;
			color: #F5F5F5;
			position:relative;
			// background: linear-gradient(to bottom,rgb(255,115,66),rgb(255,193,172));	
			// background: url(../../static/images/banner.png);
			// background-size: 100% 100%;
			display: flex;
			// justify-content: space-around;
			// 输入框 
			.search_mian{
				width: 530rpx;
				height: 74rpx;
				background-color: #ffffff;
				border-radius: 40rpx;
				position: absolute;
				top: 20rpx;
				left: 200rpx;
				display: flex;
				.search{
					margin-left: 30rpx;
					width: 404rpx;
					height: 60rpx;
					// margin-top: 2rpx;
					:deep(.is-input-border){
						// border-radius: 40rpx;
						border: 1px solid #fff;
					}
				}
				.opensearch{
					width: 110rpx;
					height: 50rpx;
					color: #FF2020;
					margin-top: 12rpx;
					line-height: 50rpx;
					font-size: 32rpx;
					border-left: 1px solid #FF2020;
				}
			}

			// 最上方的位置
			.positioning{
				width: 200rpx;
				height:60rpx;
				position: absolute;
				top: 30rpx;
				left: 0rpx;
				overflow: hidden;
				// 超出出现省略号
				text-overflow: ellipsis;
				// border: 1px solid black;
				// background: rgba(204, 204, 204, 0.2);
				color: #F5F5F5;
				// border-radius:28rpx;
				// display: flex;
				text-overflow: ellipsis;
					overflow: hidden;
					white-space: nowrap;
				.positioning_left{
					width: 42rpx;
					height: 42rpx;
					// background: url(../../static/images/定位.png);
					// background-size: 100% 100%;
					position: absolute;
					// margin: 8rpx 0 0 4rpx;
					top: 5rpx;
					left: 4rpx;
				}
				.positioning_right{
					width: 150rpx;
					height: 54rpx;
					position: absolute;
					// margin: 8rpx 0 0 4rpx;
					top: 0rpx;
					left: 44rpx;
					// padding:  0 18rpx 0 2rpx;
					line-height:60rpx;
					text-align: left;
					font-size: 30rpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
					text-overflow: ellipsis;
					overflow: hidden;
					white-space: nowrap;
				}
			}
		}
		.whatShop{
			// width: 700rpx;
			height: 70rpx;  
			// border: 1px solid black;
			margin: 0 auto;
			margin-bottom: 30rpx;
			font-size: 34rpx;
			color: #FFFFFF;

			.whatShop_mina{
				width: 710rpx;
				margin-left: 20rpx;
				:deep(.zb-tabs__nav_inner){
					width: 580rpx;
					margin: 0 auto;
					background-color:transparent;
				}
				:deep(.zb-tab){
					color: #F0F0F0;
					font-size: 32rpx;
				}
				:deep(.zb-tab--shrink){
					padding: 0 32rpx;
					// margin: 0 10rpx;
				}
				// :deep(.zb-tabs__line){
				// 	background: #F0F0F0;
				// }
			}
		}
		// 上方三个导航栏
		.nav{
			width: 718rpx;
			// height: 200rpx;
			// background-color: rgb(236, 235, 235);
			margin: 0 auto;
			background-color: #FFFFFF;
			border: 1px solid #fff;
			font-family: PingFang SC-Medium, PingFang SC;
			border-radius: 20rpx 20rpx 0 0;
			.nav_main{
				width: 660rpx;
				height: 70rpx;
				background-color: #F0F0F0;
				// background: linear-gradient(180deg, rgba(255, 85, 0, 1) 0%, rgba(250, 145, 85, 1) 100%);
				// box-shadow: 0px 2px 4px  rgba(0, 0, 0, 0.25);
				margin: 0 auto;
				margin-top: 20rpx;
				margin-bottom: 20rpx;
				border-radius: 35rpx;
				font-size: 36rpx;
				font-weight: 500;
				// border: 1px solid black;
				display: flex;
				justify-content:space-around;
				.nav_main_item{
					width: 250rpx;
					height: 70rpx;
					background-color: #F0F0F0 ;
					text-align: center;
					color: #666666;
					border-radius: 35rpx;
					// border-bottom: 10rpx solid orange;
					.nav_main_item_span{
						font-size: 36rpx;
						font-weight: 600;
						line-height: 70rpx;
					}
					.nav_item_bottom{
						margin-top: 6rpx;
						line-height: 20px;
						font-size: 12px;
						font-weight: 400;
					}
				}
				.active{
					background-color: #FF2020 ;
					color: #fff;
					// border-radius: 80rpx;
					// box-shadow: 0px 2px 4px  rgba(0, 0, 0, 0.25);
				}
			}
			// 下拉的选择框
			.dropBown{
				width: 680rpx;
				height: 50rpx;
				margin: 0 auto;
				// padding-right: 30rpx;
				margin-top: 20rpx;
				margin-bottom: 20rpx;
				display: flex;
				justify-content: space-around;
				position: relative;
				.dropBownone{
					// width: 220rpx;
					height: 50rpx;
					display: flex;
					justify-content: space-around;
					.dropBownone_left{
						// width: 184rpx;
						height: 50rpx;
						line-height: 50rpx;
						font-size: 28rpx;
						text-align: center;
						font-family: PingFang SC-Regular, PingFang SC;
						font-weight: 400;
						color: #666666;
						overflow: hidden;
					}
					.dropBownone_right{
						margin: 5rpx 0 0 1rpx;
						width: 36rpx;
						height: 36rpx;
						background-color: #F50909;
						background: url(../../static/images/xiajiantou.png);
						background-size: 100% 100%;
					}
				}
				.active{
					.dropBownone_left{
						color: #FF1F1F;
					}
					.dropBownone_right{
						margin: 5rpx 0 0 7rpx;
						width: 36rpx;
						height: 36rpx;
						background: url(../../static/images/shangjiaobiao.png);
						background-size: 100% 100%;
					}
				}
			}
		}

		// 中间的内容
		.main{
			width: 100%;
			margin-bottom: 120rpx;
			// min-height: 60vh;
			font-family: '思源黑体';
			display: flex;
			justify-content: center;
			border-radius: 0 0 20rpx 20rpx;

			.main_lists{
				width: 720rpx;
				// height: 100rpx;
				// background-color: pink;
				background-color: #FFFFFF;
				border-radius:  0 0 20rpx 20rpx;
				position: relative;
				.main_listone{
					width: 720rpx;
					height: calc(100vh - 350rpx);
					background: url(../../static/images/kongbai3.png) no-repeat;
					background-size: 100%;
					border-radius:  0 0 20rpx 20rpx;
					// z-index: 88;
				}
				.shop_son_type{
					position: absolute;
					width: 720rpx;
					background-color: rgba(0, 0, 0, 0.6);
					height: calc(100vh - 350rpx);
					z-index: 99;
					.son_type_one{
						width: 720rpx;
						padding-top: 10rpx;
						display: flex;
						flex-wrap: wrap;
						// justify-content: space-around;
						align-items: flex-start;
						background-color: #FFFFFF;
						.type_one_item{
							width: 200rpx;
							height: 50rpx;
							font-size: 24rpx;
							line-height: 50rpx;
							margin: 4rpx 0 10rpx 30rpx;
							text-align: center;
							border-radius: 10rpx;
							color: rgb(97, 96, 96);
							background-color: rgb(235, 235, 235);
						}
						.active_son{
							color: #F50909 ;
							background-color: rgba(250, 229, 225, 1);
						}
					}
					.son_type_two{
						width: 720rpx;
						height: 80rpx;
						padding-top: 30rpx;
						font-size: 28rpx;
						text-align: center;
						background-color: #FFFFFF;
						display: flex;
						justify-content: space-around;
						.type_two_let{
							width: 240rpx;
							height: 60rpx;
							background-color:rgba(229, 229, 229, 1);
							border-radius: 10rpx;
							line-height: 60rpx;
							color: rgba(0, 0, 0, 1);
						}
						.type_two_right{
							width: 240rpx;
							height: 60rpx;
							background-color: #F50909 ;
							border-radius: 10rpx;
							line-height: 60rpx;
							color: #FFFFFF;
						}
					}
					.son_type_three{
						width: 100%;
						height: 800rpx;
						// background-color: #9C7EFF;
					}
				}
				.main_lists_item{
					width: 720rpx;
					height: 222rpx;
					background-color: #fff;
					margin-bottom: 0rpx;
					position: relative;
					display: flex;
					border-radius: 20rpx;
					border-bottom: 1rpx solid rgb(230, 230, 230);
					.Topping{
						width: 64rpx;
						height: 36rpx;
						font-size: 24rpx;
						border-radius: 8rpx 0rpx 8rpx 0rpx;
						text-align: center;
						line-height: 36rpx;
						color: rgba(255, 255, 255, 1);
						background-color: #FF334E;
						z-index: 2;
						position: absolute;
						left: 16rpx;
						top: 18rpx;
					}
					.item_left{
						width: 236rpx;
						height: 200rpx;
						// border: 1px solid black;
						margin: 9rpx 0 0 16rpx;
						position: relative;
						// background-image: url(https://img.72qq.com/file/202007/24/aed12b08ae.jpg);
						// background-size: 100% 100%;
						.item_left_img{
							width: 236rpx;
							height: 184rpx;
							// background-size: cover;
							margin-top: 8rpx;
							border-radius: 8rpx;
						}
						.visits{
							width: 140rpx;
							height: 40rpx;
							// background-color: pink;
							position: absolute;
							border-radius: 20rpx;
							z-index: 33;
							top: 156rpx;
							left: 4rpx;
							font-size: 24rpx;
							display: flex;
							color: rgba(255, 255, 255, 1);
							font-weight: 300;
							.visits_img{
								margin: 0rpx 2rpx 0 2rpx;
								width: 32rpx;
								height: 38rpx;
								// background: url(../../static/images/yanjin.png);
								// background-size: 100% 100%;
							}
						}
					}
					.item_right{
						width: 500rpx;
						height: 230rpx;
						margin-left: 10rpx;
						overflow: hidden;
						text-overflow: ellipsis;
						.item_right_one{
							color: #333333;
							width: 430rpx;
							height: 40rpx;
							text-indent:6rpx;
							font-size: 32rpx;
							margin-left: 10rpx;
							margin-top: 16rpx;
							font-weight: 600;
							line-height: 40rpx;
							overflow: hidden;
							// 超出出现省略号
							text-overflow: ellipsis;
							// 换行
							white-space: nowrap;
							.isspan{
								color:#FF334E ;
							}
						}
						.item_right_two_big{
							width: 420rpx;
							height: 40rpx;
							margin:8rpx 0 4rpx 14rpx;
							display: flex;
							text-overflow: ellipsis;
							overflow: hidden;
							white-space: nowrap;
							.item_right_two{

								// font-family: PingFang SC-Regular, PingFang SC;
								font-weight: 400;
								color: #aeadad;
								line-height: 40rpx;
								font-size: 26rpx;

								text-overflow: ellipsis;
								overflow: hidden;
								white-space: nowrap;
							}
							.three_are{
								height: 40rpx;
								margin:  0 0 0 30rpx;
								line-height: 40rpx;
								font-size: 26rpx;
								background: rgba(0,162,255,0.06);
								color: #00A2FF;
								font-weight: 500;
								border-radius: 10rpx;
							}
						}
						
						.item_right_identifying{
							width: 420rpx;
							height: 40rpx;
							margin: 6rpx 0 2rpx 0;
							display: flex;
							// margin-top: 2rpx;
							text-overflow: ellipsis;
							overflow: hidden;
							white-space: nowrap;
							// border: 1px solid black;
							.item_right_identifying_item{
								// width: 120rpx;
								height: 30rpx;
								font-size: 24rpx;
								font-weight: 400;
								line-height: 30rpx;
								padding: 5rpx 10rpx 5rpx 10rpx;
								// color: rgba(255, 141, 26, 1);
								margin-left: 14rpx;
								text-align: center;
								// border: 1px solid rgba(255, 141, 26, 1);
								border-radius: 12rpx;
								&:nth-child(1) {
									background-color: rgba(249,189,82,0.12);
									color:#F9BD52;
								}
								&:nth-child(2) {
									background-color: rgba(156,126,255,0.12) ;
									color:#9C7EFF ;
								}
								&:nth-child(3) {
									background-color: rgba(63,210,140,0.12);
									color:#3FD28C;
								}
								&:nth-child(4) {
									background-color:rgba(210,63,63,0.12);
									color:#D23F3F;
								}
								&:nth-child(5) {
									background-color:rgba(79,75,255,0.12);
									color:#4F4BFF;
								}
								&:nth-child(6) {
									background-color: rgba(255,0,214,0.12);
									color:#FF00D6 ;
								}
							}
						}				
						.item_right_three{
							width: 420rpx;
							height: 60rpx;
							padding-left: 12rpx;
							display: flex;
							justify-content: space-between;
							.three_money{
								height: 60rpx;
								line-height: 60rpx;
								font-size: 36rpx;
								font-family: PingFang SC-Medium, PingFang SC;
								font-weight: 600;
								color: #F50909 ;
								.span1{
									font-size: 24rpx;
								}
							}

							.three_time{
								width: 145rpx;
								height: 40rpx;
								font-size: 24rpx;
								font-family: PingFang SC-Regular, PingFang SC;
								font-weight: 400;
								line-height: 40rpx;
								margin-top: 14rpx;
								color: #999999;
								line-height: 40rpx;
								overflow: hidden;
							// 超出出现省略号
							// text-overflow: ellipsis;
							// 换行
								white-space: nowrap;
							}
						}
						.item_right_five{
							font-size: 12px;
							margin-left: 30rpx;
							color: rgb(163, 169, 175);
						}
					}
				}
			}
			// 搜索店铺
			.main_listtwo{
				width: 720rpx;
				background-color: #fff;
				border-radius:  0 0 20rpx 20rpx;
				.main_twoif{
					width: 720rpx;
					height: calc(100vh - 330rpx);
					// background: url(../../static/images/kongbai3.png) no-repeat;
					// background-size: 100%;
					.img{
						width: 600rpx;
						height: 400rpx;
						margin-left:50rpx;
						// background: url(../../static/images/kongbai3.png) no-repeat;
						// background-size: 100%;
					}
				}

				.lists_item{
					width: 720rpx;
					height: 220rpx;
					background-color: #fff;
					margin-bottom: 20rpx;
					position: relative;
					display: flex;
					border-radius: 20rpx;
					.Toppingtwo{
						width: 100rpx;
						height: 30rpx;
						line-height: 30rpx;
						text-align: center;
						font-size: 24rpx;
						background-color: #FF2020;
						border-radius: 8rpx 0 8rpx 8rpx;
						color: white;
						z-index: 3;
						position: absolute;
						right: 0;
					}
					.item_left{
						width: 650rpx;
						height: 200rpx;
						// border: 1px solid black;
						margin-left: 10rpx;
						.item_left_one{
							width: 600rpx;
							height: 60rpx;

							// background-color: pink;
							margin: 6rpx 0 0 10rpx;
							line-height: 60rpx;
							font-size: 30rpx;
							font-weight: 700;
							color: rgba(46, 46, 46, 1);
							text-overflow: ellipsis;
							overflow: hidden;
							white-space: nowrap;
							.isspan{
								color: rgba(255, 87, 51, 1);
							}
						}
						.item_right_identifying{
							width: 690rpx;
							height: 40rpx;
							margin: 2rpx 0 2rpx 0;
							display: flex;
							// margin-top: 2rpx;
							text-overflow: ellipsis;
							overflow: hidden;
							white-space: nowrap;
							// border: 1px solid black;
							.item_right_identifying_item{
								// width: 120rpx;
								height: 30rpx;
								font-size: 24rpx;
								font-weight: 400;
								line-height: 30rpx;
								padding: 5rpx 10rpx 5rpx 10rpx;
								// color: rgba(255, 141, 26, 1);
								margin-left: 14rpx;
								text-align: center;
								// border: 1px solid rgba(255, 141, 26, 1);
								border-radius: 12rpx;
								&:nth-child(1) {
									background-color: rgba(249,189,82,0.12);
									color:#F9BD52;
								}
								&:nth-child(2) {
									background-color: rgba(156,126,255,0.12) ;
									color:#9C7EFF ;
								}
								&:nth-child(3) {
									background-color: rgba(63,210,140,0.12);
									color:#3FD28C;
								}
								&:nth-child(4) {
									background-color:rgba(210,63,63,0.12);
									color:#D23F3F;
								}
								&:nth-child(5) {
									background-color:rgba(79,75,255,0.12);
									color:#4F4BFF;
								}
								&:nth-child(6) {
									background-color: rgba(255,0,214,0.12);
									color:#FF00D6 ;
								}
								&:nth-child(7) {
									background-color: rgba(249,189,82,0.12);
									color:#F9BD52;
								}
								&:nth-child(8) {
									background-color: rgba(156,126,255,0.12) ;
									color:#9C7EFF ;
								}
								&:nth-child(9) {
									background-color: rgba(63,210,140,0.12);
									color:#3FD28C;
								}
							}
						}
						.item_left_two{
							width: 690rpx;
							height: 44rpx;
							margin: 6rpx 0 0 10rpx;
							// background-color: pink;
							line-height: 44rpx;
							font-size: 26rpx;
							font-weight: 400;
							color: rgb(88, 86, 86);
						}
						.item_right_three{
							width: 690rpx;
							height: 60rpx;
							padding-left: 12rpx;
							display: flex;
							justify-content: space-between;
							.three_ipone{
								height: 60rpx;
								line-height: 60rpx;
								font-size: 26rpx;
								font-family: PingFang SC-Medium, PingFang SC;
								font-weight: 600;
								color: rgb(88, 86, 86);
							}
							.three_time{
								width: 235rpx;
								height: 40rpx;
								font-size: 24rpx;
								font-family: PingFang SC-Regular, PingFang SC;
								font-weight: 400;
								line-height: 40rpx;
								margin-top: 14rpx;
								color: #999999;
								line-height: 40rpx;
								overflow: hidden;
							// 超出出现省略号
							// text-overflow: ellipsis;
							// 换行
								// white-space: nowrap;
							}
						}
						.hrone{
							width: 730rpx;
							height: 1rpx;
							background-color: #e9e9e9;
						}
					}
					.item_right{
						width: 200rpx;
						height: 220rpx;
						margin-left: 10rpx;
						// border: 1px solid black;
						.item_right_center{
							width: 150rpx;
							height: 56rpx;
							margin: 100rpx 0 0 20rpx;
							border-radius: 10rpx;
							background: rgba(255, 87, 51, 1);
							font-size: 28rpx;
							color: #F5F5F5;
							line-height:56rpx ;
							text-align: center;
						}
						.item_right_time{
							width: 240rpx;
							font-size: 24rpx;
							color: rgba(143, 143, 143, 1);
							margin:20rpx 0 0 -40rpx;
							text-overflow: ellipsis;
							overflow: hidden;
							white-space: nowrap;
						}
					}
				}
			}

		}

	}
	.tabbar{
			position: fixed;
			margin: 0 auto;
			bottom: 0;
			z-index: 99;
	}
	// 设置滚动条的高
	.scroll-one{
		width: 100%;
		height: calc(100vh - 190rpx);
		// border: 1px solid black;
		// padding-bottom: 400rpx;
	}
	.scroll-two{
		width: 100%;
		height: calc(100vh - 100rpx);
	}
	// 设置加载中的样式
	.show_Loading{
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
	}
	.kbhz{
		height: 100rpx;
	}
	// 弹出框的样式
	.popupipone{
		width: 750rpx;
		height: 106 0rpx;
		border: 1px solid rgba(255, 236, 223, 1);
		background: linear-gradient(180deg, rgba(255, 236, 223, 1) 0%, rgba(255, 246, 240, 1) 100%);
		// border-radius: 20rpx;
		font-family: '思源黑体';
		// background-color: pink;
		border-top-right-radius: 30rpx;
		border-top-left-radius: 30rpx;
		position: relative;
		// bottom: -54rpx;
		.image{
			width: 260rpx;
			height: 260rpx;
			// border: 1px solid black;
			// background: url(../../static/images/book.png) no-repeat;
			// background-size: 100% 100%;
			position: absolute;
			top: -120rpx;
		}
		.popupipone_imgtwo{
			width: 48rpx;
			height: 48rpx;
			border-radius: 40rpx;
			background: url(../../static/images/chacha.png) no-repeat;
			background-size: 100% 100%;
			position: absolute;
			left: 666rpx;
			top: 20rpx;
		}
		.tk_one{
			width: 600rpx;
			height: 180rpx;
			// background-color: pink;
			margin: 0 auto;
			margin-top: 60rpx;
			.title_one{
				width: 600rpx;
				height: 100rpx;
				font-size: 44rpx;
				// border: 1px solid black;
				font-weight: 700;
				line-height: 50px;
				color: rgba(0, 0, 0, 1);
				text-align: center;

			}
			.title_two{
				width: 600rpx;
				height: 140rpx;
				font-size: 26rpx;
				font-weight: 300;
				color: rgba(128, 128, 128, 1);
			}
		}
		.hr{
			width: 680rpx;
			height: 10rpx;
			margin: 0 auto;
			border-bottom: 1px solid rgb(210, 208, 207);
		}
		.radio{
			width:700rpx;
			height: 100rpx;
			// border: 1px solid black;
			margin: 0 auto;
			display: flex;
			justify-content: space-around;
			.radio_item{
				width: 330rpx;
				height: 100rpx;
				background-color: rgb(236, 236, 236);
				border: 1px solid rgb(255, 246, 238);
				border-radius: 10rpx;
				display: flex;
				.item_left{
					width: 230rpx;
					height: 100rpx;
					margin-left: 20rpx;
					// border: 1px solid black;
					.text_top{
						width: 200rpx;
						height: 60rpx;
						font-size: 32rpx;
						font-weight: 700;
						letter-spacing: 0px;
						line-height: 65rpx;
						color: rgba(0, 0, 0, 1);
						text-align: left;
						vertical-align: top;
					}
					.text_bottom{
						width: 200rpx;
						height: 40rpx;
						font-size: 22rpx;
						line-height: 35rpx;
						color: rgba(0, 0, 0, 1);

					}
				}
				.item_right{
					width: 60rpx;
					height: 60rpx;
					margin-top: 20rpx;
					// background: url(../../static/images/cz.png) no-repeat;
					background-size: 100% 100%;
				}
			}
			.active{
				background-color: rgba(255, 224, 201, 1);
				border: 1px solid rgba(255, 87, 51, 1);
				.item_left{
					color: rgba(255, 87, 51, 1);
					.text_top{
						color: rgba(255, 87, 51, 1);
					}
					.text_bottom{
						color: rgba(255, 87, 51, 1);
					}
				}
			}
		}
		.title_name{
			width: 680rpx;
			height: 80rpx;
			margin:  0 auto;
			margin-top: 10rpx;
			font-size: 32rpx;
			font-weight: 700;
			line-height: 80rpx;
			color: rgba(0, 0, 0, 1);
			// border: 1px solid black;
		}
		.input_one{
			width: 660rpx;
			height: 80rpx;
			padding-left: 20rpx;
			// border: 1px solid black;
			margin: 0 auto;
			border-radius: 16rpx;
			background-color: rgba(255, 229, 209, 1);
		}
		.input_two{
			width: 660rpx;
			height: 80rpx;
			padding-left: 20rpx;
			// border: 1px solid black;
			margin: 0 auto;
			border-radius: 16rpx;
			background-color: rgba(255, 229, 209, 1);
		}
		.getphone{
			width: 680rpx;
			height: 80rpx;
			margin: 0 auto;
			border-radius: 16rpx;
			background-color: rgba(255, 229, 209, 1);
			display: flex;
			position: relative;
			.input_twoo{
				width: 430rpx;
				height: 80rpx;
				// border: 1px solid black;
				margin: 0 auto;
				background-color: rgba(255, 229, 209, 1);
				position: absolute;
				top: 0;
				left: 20rpx;
			}
			.logon{
				width: 180rpx;
				height: 78rpx;
				// border-radius: 0;
				background-color: rgba(255, 229, 209, 1);
				border:1px solid rgb(255, 151, 132);
				font-size: 24rpx;
				line-height: 78rpx;
				color:rgba(255, 87, 51, 1) ;
				position: absolute;
				top: 0;
				left: 470rpx;
			}
		}
		.region{
			width: 660rpx;
			height: 80rpx;
			background-color: rgba(255, 229, 209, 1);
			margin: 0 auto;
			padding-left: 20rpx;
			border-radius: 16rpx;
			display: flex;
			.address_i{
				width: 48rpx;
				height: 48rpx;
				margin: 16rpx 10rpx 0 0;
				// background-color: pink;
				background: url(../../static/images/位置.png);
				background-size: 100%;
				
			}
			.Address-item{
				width: 500rpx;
				height: 80rpx;
				line-height: 80rpx;
				// border: 1px solid black;
				font-size: 28rpx;
				color: rgba(0, 0, 0, 1);
			}
			.address_ii{
				width: 40rpx;
				height: 40rpx;
				background:url(../../static/images/向下.png);
				background-size: 100%;
				margin: 20rpx 0 0 0;
			}
		}

		.tijiao{
			width: 600rpx;
			height: 90rpx;
			margin:  0 auto;
			margin-top: 30rpx;
			// border: 1px solid black;
			background-color: rgba(255, 87, 51, 1);
			border-radius: 50rpx;
			font-size: 40rpx;
			font-weight: 400;
			line-height: 90rpx;
			color: rgba(255, 255, 255, 1);
			text-align: center;
		}
	}
	// 基础信息弹框
	.popupbase{
		width: 750rpx;
		height: 650rpx;
		background: linear-gradient(224.09deg, rgba(255, 222, 246, 1) 0%, rgba(255, 250, 233, 1) 50.02%, rgba(255, 255, 255, 1) 100%);
		border-top-right-radius: 20rpx;
		border-top-left-radius: 20rpx;
		position: relative;
		.icon{
			width: 300rpx;
			height: 300rpx;
			position: absolute;
			top: -140rpx;
			left: 220rpx;
		}
		.cha{
			width: 58rpx;
			height: 58rpx;
			border-radius: 40rpx;
			background: url(../../static/images/chacha.png) no-repeat;
			background-size: 100% 100%;
			position: absolute;
			left: 666rpx;
			top: 20rpx;
		}
		.tit1{
			width: 450rpx;
			height: 150rpx;
			// border: 1px solid black;
			position: absolute;
			top: 140rpx;
			left: 150rpx;
			.titone{
				width: 450rpx;
				height: 80rpx;
				font-size: 46rpx;
				font-weight: 700;
				line-height: 80rpx;
				color: rgba(0, 0, 0, 1);
				text-align: center;
			}
			.tittwo{
				width: 450rpx;
				height: 50rpx;
				font-size: 30rpx;
				line-height: 50rpx;
				color: rgba(128, 128, 128, 1);
				text-align: center;
			}
		}
		.quanyi{
			width: 720rpx;
			// border: 1px solid black;
			position: absolute;
			top: 300rpx;
			left: 40rpx;
			display: flex;
			.item{
				width: 148rpx;
				height: 200rpx;
				margin: 12rpx;
				// border: 1px solid black;
				.icon_bag{
					width: 100rpx;
					height: 100rpx;
					margin: 0 auto;
					border-radius: 16rpx;
					background-color:rgba(250, 225, 220, 1);
					position: relative;
					.icon{
						width: 70rpx;
						height: 70rpx;
						position: absolute;
						top: 15rpx;
						left: 15rpx;
					}
				}
				.bigtit{
					width: 148rpx;
					height: 40rpx;
					font-size: 14px;
					font-weight: 700;
					margin-top: 8rpx;
					letter-spacing: 1px;
					line-height: 20.27px;
					color: rgba(0, 0, 0, 1);
					text-align: center;
					vertical-align: top;
				}
				.tit{
					width: 158rpx;
					height: 20rpx;
					font-size: 22rpx;
					font-weight: 400;
					margin-top: 4rpx;
					line-height: 30rpx;
					color: rgba(0, 0, 0, 1);
					text-align: center;

				}
			}
		}
		.buttom{
			width: 600rpx;
			height: 90rpx;
			background-color: rgba(254, 133, 13, 1);
			position: absolute;
			top: 540rpx;
			left: 70rpx;
			border-radius: 50rpx;
			font-size: 44rpx;
			line-height: 90rpx;
			color: rgba(255, 255, 255, 1);
			text-align: center;
		}
	}

	// 求租的支付弹框
	.popuppay{
		width: 750rpx;
		// height: 00rpx;
		background-color: rgba(255, 255, 255, 1);
		border-top-right-radius: 20rpx;
		border-top-left-radius: 20rpx;
		position: relative;
		.popuppay_imgtwo{
			width: 48rpx;
			height: 48rpx;
			border-radius: 40rpx;
			background: url(../../static/images/chacha.png) no-repeat;
			background-size: 100% 100%;
			position: absolute;
			left: 666rpx;
			top: 20rpx;

		}
		.main_one{
				width: 750rpx;
				height: 100rpx;
				// border: 1px solid black;
				display: flex;
				.black{
					width: 6rpx;
					height: 30rpx;
					background-color: rgb(241, 17, 17);
					border-radius: 4prx;
					margin: 40rpx 0 0 20rpx;
				}
				.black_tit{
					width: 500rpx;
					height: 50rpx;
					margin: 30rpx 0 0 10rpx;
					font-size: 32rpx;
					font-weight: 600;
					line-height: 50rpx;
					color: rgba(0, 0, 0, 1);
				}
			}
		.check{
			width: 750rpx;
			height: 90rpx;
			// border: 1px solid black;
			display: flex;
			justify-content: space-around;
			.item{
				width: 340rpx;
				height: 90rpx;
				box-shadow: 4px 4px 14px 2px rgba(0, 0, 0, 0.25);
				border-radius: 10rpx;
				border: 1px solid #fff;
				position: relative;
				display: flex;
				.tit{
					width: 190rpx;
					height: 90rpx;
					font-size: 30rpx;
					font-weight: 400;
					line-height: 90rpx;
					color: rgba(245, 164, 71, 1);
					text-align: center;

				}
				.money{
					width: 130rpx;
					height: 90rpx;
					font-size: 38rpx;
					font-weight: 900;
					line-height: 90rpx;
					color: rgba(56, 56, 56, 1);
					text-align: center;
				}
				.jiaobiao{
					width: 36rpx;
					height: 36rpx;
					// border: 1px solid black;
					background:url(../../static/images/jiaobiao.png);
					background-size: 100%;
					position: absolute;
					top: 54rpx;
					left: 304rpx;

				}
			}
			.active{
				border: 1px solid rgba(255, 87, 51, 1);
				background: linear-gradient(90deg, rgba(251, 225, 190, 1) 0%, rgba(252, 217, 217, 0.22) 100%);
				.money{
						color:rgba(255, 87, 51, 1);
				}
			}
			// 选中之后展示的图标

		}
		.quanyi{
			width: 720rpx;
			margin: 0 auto;
			display: flex;
			flex-wrap: wrap;
			.item{
				width: 148rpx;
				height: 200rpx;
				margin: 12rpx;
				// border: 1px solid black;
				.icon_bag{
					width: 100rpx;
					height: 100rpx;
					margin: 0 auto;
					border-radius: 16rpx;
					background-color:rgba(250, 225, 220, 1);
					.icon{
						width: 70rpx;
						height: 70rpx;
						margin: 15rpx;
					}
				}
				.bigtit{
					width: 148rpx;
					height: 40rpx;
					font-size: 14px;
					font-weight: 700;
					margin-top: 8rpx;
					letter-spacing: 1px;
					line-height: 20.27px;
					color: rgba(0, 0, 0, 1);
					text-align: center;
					vertical-align: top;
				}
				.tit{
					width: 158rpx;
					height: 20rpx;
					font-size: 22rpx;
					font-weight: 400;
					margin-top: 4rpx;
					line-height: 30rpx;
					color: rgba(0, 0, 0, 1);
					text-align: center;

				}
			}
		}
		.bottom{
			width: 750rpx;
			height: 100rpx;
			border-top: 1px solid rgb(167, 164, 164);
			display: flex;
			.bottom_one{
				width: 450rpx;
				height: 100rpx;
				// border: 1px solid black;
				color: rgba(255, 87, 51, 1);
				text-align: center;
				line-height: 100rpx;
				font-size: 26rpx;
			}
			.bottom_two{
				width: 300rpx;
				height: 100rpx;
				background-color: #F50909;
				color: #fff;
				text-align: center;
				line-height: 100rpx;
				font-size: 30rpx;
			}
		}
	}

	// 授权手机号的弹框
	.empowerphone{
		width: 750rpx;
		// height: 400rpx;
		background: linear-gradient(180deg, rgba(255, 236, 223, 1) 0%, rgba(255, 246, 240, 1) 100%);
		border-top-right-radius: 20rpx;
		border-top-left-radius: 20rpx;
		position: relative;
		.hader{
			width:750rpx;
			height:240rpx;
			// border: 1px solid black;
			.img{
				width: 140rpx;
				height: 140rpx;
				border-radius: 10rpx;
				margin: 70rpx 0 0 300rpx;
			}

			.colse{
				width: 58rpx;
				height: 58rpx;
				margin: 10rpx 10rpx 0 0;
				position: absolute;
				top: 10rpx;
				right: 10rpx;
			}
		}
		.logon{
			width: 600rpx;
			height: 80rpx;
			background-color: rgba(255, 87, 51, 1);
			margin: 0 auto;
			margin-top: 40rpx;
			font-size: 34rpx;
			font-weight: 400;
			line-height: 80rpx;
			color: rgba(255, 255, 255, 1);
			text-align:center;
		}
		.other{
			width: 600rpx;
			height: 80rpx;
			background-color: transparent;
			border: 1px solid rgba(128, 128, 128, 1);
			border-radius: 10rpx;
			margin: 0 auto;
			margin-top: 40rpx;
			font-size: 34rpx;
			font-weight: 400;
			line-height: 80rpx;
			color: rgba(128, 128, 128, 1);
			text-align:center;
		}
		.agreement{
			width: 700rpx;
			height: 80rpx;
			padding-top: 20rpx;
			margin: 0 auto;
			margin-top: 40rpx;
			// border: 1px solid black;
			font-size: 24rpx;
			line-height: 38rpx;
			display: flex;
			// margin-bottom: 40rpx;
			.imaage{
				width: 38rpx;
				height: 38rpx;
				margin-left:40rpx;
				margin-right: 4rpx;
				border-radius: 50%;
				background-color: rgba(255, 87, 51, 1);
				border: 1px solid rgba(255, 87, 51, 1);
				.img{
					width: 28rpx;
					height: 18rpx;
					margin:10rpx 5rpx;
				}
			}
			.imtwo{
				width: 38rpx;
				height: 38rpx;
				margin-left:40rpx;
				margin-right: 4rpx;
				border-radius: 50%;
				// background-color: rgba(255, 87, 51, 1);
				border: 1px solid rgba(128, 128, 128, 1);
				.img{
					width: 28rpx;
					height: 18rpx;
					margin:10rpx 5rpx;
				}
			}
			.span1{
				color: rgba(255, 87, 51, 1);
			}
		}
	}

	.input_phone{
		width: 750rpx;
		// height: 400rpx;
		background: linear-gradient(180deg, rgba(255, 236, 223, 1) 0%, rgba(255, 246, 240, 1) 100%);
		border-top-right-radius: 20rpx;
		border-top-left-radius: 20rpx;
		position: relative;
		.hader{
			width:750rpx;
			height:100rpx;
			// border: 1px solid black;
			.tit{
				width: 300rpx;
				height: 60rpx;
				margin-left: 220rpx;
				padding-top: 20rpx;
				// border: 1px solid black;
				font-size: 36rpx;
				font-weight: 700;
				line-height: 26.06px;
				color: rgba(0, 0, 0, 1);
				text-align: center;

		
			}

			.colse{
				width: 58rpx;
				height: 58rpx;
				margin: 10rpx 10rpx 0 0;
				position: absolute;
				top: 10rpx;
				right: 10rpx;
			}
		}
		.input_one{
			width: 600rpx;
			height: 80rpx;
			padding-left: 20rpx;
			// border: 1px solid black;
			margin: 0 auto;
			margin-top: 20rpx;
			border-radius: 16rpx;
			background-color: rgba(255, 229, 209, 1);
		}
		.logon{
			width: 600rpx;
			height: 80rpx;
			background-color: rgba(255, 87, 51, 1);
			margin: 0 auto;
			margin-top: 40rpx;
			font-size: 34rpx;
			font-weight: 400;
			line-height: 80rpx;
			border-radius: 10rpx;
			color: rgba(255, 255, 255, 1);
			text-align:center;
		}
		.other{
			width: 600rpx;
			height: 80rpx;
			background-color: transparent;
			border: 1px solid rgba(128, 128, 128, 1);
			border-radius: 10rpx;
			margin: 0 auto;
			margin-top: 40rpx;
			font-size: 34rpx;
			font-weight: 400;
			line-height: 80rpx;
			color: rgba(128, 128, 128, 1);
			text-align:center;
		}
		.agreement{
			width: 700rpx;
			height: 80rpx;
			padding-top: 20rpx;
			margin: 0 auto;
			margin-top: 40rpx;
			// border: 1px solid black;
			font-size: 24rpx;
			line-height: 38rpx;
			display: flex;
			// margin-bottom: 40rpx;
			.imaage{
				width: 38rpx;
				height: 38rpx;
				margin-left:40rpx;
				margin-right: 4rpx;
				border-radius: 50%;
				background-color: rgba(255, 87, 51, 1);
				border: 1px solid rgba(255, 87, 51, 1);
				.img{
					width: 28rpx;
					height: 18rpx;
					margin:10rpx 5rpx;
				}
			}
			.imtwo{
				width: 38rpx;
				height: 38rpx;
				margin-left:40rpx;
				margin-right: 4rpx;
				border-radius: 50%;
				// background-color: rgba(255, 87, 51, 1);
				border: 1px solid rgba(128, 128, 128, 1);
				.img{
					width: 28rpx;
					height: 18rpx;
					margin:10rpx 5rpx;
				}
			}
			.span1{
				color: rgba(255, 87, 51, 1);
			}
		}
	}
</style>
